Uncaught TypeError创建一个Aurelia插件：plugin.load不是一个函数
我创建了一个名为Aurelia-Slickgrid的新Aurelia插件，并通过.feature('resources')在本地工作。 然后，我准备好接下来的一步，将它作为插件提供给所有人，并创建一个Github项目，并在此GitHub链接下提供 - Aurelia-Slickgrid。 我使用Aurelia Skeleton Plugin创建我的插件，同时运行gulp gulp build来创建转录输出。 然后我在NPM上发布了它，并成功安装了npm i --save aurelia-slickgrid 。 我目前正在使用Aurelia-CLI进行捆绑，并且一切正常，直到我打开浏览器并看到控制台中出现错误（现在我在浏览器中留下了一个白页）：
Uncaught TypeError: plugin.load is not a function
at Module.<anonymous> (vendor-bundle.js:5308)
...
目前，我正试图将它作为Aurelia-CLI的插件加载。 请参阅下面的完整配置使用：
插件的index.js
import {AureliaSlickgrid} from './aurelia-slickgrid';
import {SlickPager} from './slick-pager';
import {SlickWindowResizer} from './slick-window-resizer';
export function configure(config) {
config.globalResources('./aurelia-slickgrid');
config.globalResources('./slick-pager');
config.globalResources('./slick-window-resizer');
}
export {
AureliaSlickgrid,
SlickPager,
SlickWindowResizer
}
main.js （我的本地项目）
aurelia.use
.standardConfiguration()
.feature('resources')
.plugin('aurelia-slickgrid');
aurelia.json （我的本地项目）
{
"name": "aurelia-slickgrid",
"path": "../node_modules/aurelia-slickgrid/dist/amd",
"main": "index"
},
如果您使用空的Aurelia CLI项目进行测试，则需要添加：
{
"name": "aurelia-slickgrid",
"path": "../node_modules/aurelia-slickgrid/dist/amd",
"main": "index"
},
"slickgrid-es6",
"jquery"
最后通过以下代码import到代码中使用它：
import {AureliaSlickgrid} from 'aurelia-slickgrid';
有关如何创建Aurelia Plugin的文档几乎不存在，所以我基于另一个插件，即Aurelia-Bootstrap，由Aurelia贡献者贡献。 其中一个对我的插件代码有很大影响的文件是他的index.js，我用他的编码风格来编码我的代码。
任何想法可能是我的问题？
我也尝试将resources添加到aurelia.json ，但它没有效果。
{
"name": "aurelia-slickgrid",
"path": "../node_modules/aurelia-slickgrid/dist/amd",
"main": "index",
"resources": [
"**/*.html"
]
},
在搜索了一些其他Aurelia插件后进一步了解了一下。 似乎globalResources应该只是View / ViewModel对（html / js），在我的情况下，我只有一对是SlickPager ，现在只有一个被globalResources()调用。 另一个可能的问题，仍然要确认，但我有一个名为aurelia-slickgrid.js的文件，它与插件名称相同，可能导致冲突？ 可能......谁知道。 所以无论如何，我将它重命名为SlickService slick-service.js并将该类重命名为SlickService 。 我现在可以在WebPack Skeleton调用2/3的对象，但是我仍然无法导入SlickService 。
更新插件的index.js
import { SlickService } from './slick-service';
import { SlickPager } from './slick-pager';
import { SlickWindowResizer } from './slick-window-resizer';
export function configure(aurelia) {
aurelia.globalResources('./slick-pager');
}
export { SlickService, SlickPager, SlickWindowResizer };
我现在可以在没有问题的情况下在WebPack调用它
import {SlickPager, SlickWindowResizer} from 'aurelia-slickgrid';
@inject(SlickPager, SlickWindowResizer)
export class Test {
constructor(slickPager, slickWindowResizer) {
console.log(slickPager, slickWindowResizer);
}
}
但是，如果我也导入SlickService ，它会引发错误
import {SlickPager, SlickWindowResizer, SlickService} from 'aurelia-slickgrid';
@inject(SlickPager, SlickWindowResizer, SlickService)
export class Test {
constructor(slickPager, slickWindowResizer, slickService) {
console.log(slickPager, slickWindowResizer, slickService);
}
}
先前的SlickService代码现在引发这个错误
ERROR [app-router] Error: Error invoking SlickService. Check the inner error for details.
------------------------------------------------
Inner Error:
Message: key/value cannot be null or undefined. Are you trying to inject/register something that doesn't exist with DI?
"resources": ["**/*.{css,html}"] 上一篇: Uncaught TypeError creating an Aurelia Plugin: plugin.load is not a function