如何在打字稿中导入js文件作为模块
Posted
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了如何在打字稿中导入js文件作为模块相关的知识,希望对你有一定的参考价值。
我正在使用SharePoint中的SPFx框架,它将具有打字稿文件。我在我的应用程序中使用SPServices.js和app.js(自定义js文件)。在config.json文件中我使用如下:
"externals": {
"jQuery":{
"path":"node_modules/jquery/dist/jquery.min.js",
"globalName": "jQuery1"
},
"AppScript":{
"path":"/src/webparts/calendarEvents/app.js",
"globalName": "AppScript",
"globalDependencies": [
"jQuery",
"SPServices"
]
},
"SPServices": {
"path": "/src/webparts/calendarEvents/jquery.SPServices.min.js",
"globalName": "SPServices" ,
"globalDependencies": [
"jQuery"
]
}
}
如果我使用下面的语法,它在我的.ts文件中工作
require('SPServices')
require('AppScript')
但是,我想将它们作为对象导入而不是上面的语法,以便我可以访问这些文件中的函数。为了做到这一点,我正在使用as
import * as SPServices from 'SPServices';
import * as myScript from 'AppScript';
但这些都行不通。它给出了错误。
Resource "SPServices" not found in loader configuration of manifest for component "b052328a-ad75-4056-af7f-7bc8b3e795fc" (CalendarEventsWebPart)
但奇怪的是,同一行import * as SPServices from 'SPServices';
在另一个.ts文件中正常工作。它没有给出任何这样的错误。我真的很困惑这里错了。
为js,css文件等类型文件添加文件时为什么会有太多混淆?
答案
SPServices是在CommonJS模块用于导入功能之前编写的。它通过扩展jQuery来工作。试试这个:
import * as jQuery from 'jQuery';
require('SPServices');
$().SPServices.doStuff();
有关此用例的更多信息,请参阅Microsoft文档部分Loading a library that has a dependency on another library。
以上是关于如何在打字稿中导入js文件作为模块的主要内容,如果未能解决你的问题,请参考以下文章