我想知道如何正确地将handsontable社区版库捆绑到Aurelia应用程序中 . Handsontable作为单个JS文件分发为webpack模块,因此提示通常对webpack模块有用 .
使用默认加载程序配置Aurelia版本0.24.0:RequireJS和默认转换程序:Babel,NPM版本3.10.0 . 为了将handontable捆绑到我的应用程序中,我做了以下步骤:
npm install handsontable
然后编辑aurelia-project / aurelia.json添加以下内容
dependencies:{ ...
{
"name": "handsontable",
"path": "../node_modules/handsontable",
"main": "dist/handsontable.full",
"resources": [
"dist/handsontable.full.css"
]
},
然后组件看起来像:(view - htable.html):
<template>
<div ref="filetable"></div>
</template>
(viewmodel - ES6中的htable.js):
import {Handsontable} from "handsontable";
export class htable {
...
attached() {
this.ht = new Handsontable (this.filetable, {
data: this.data,
rowHeaders: true,
colHeaders: true
});
}
}
但是,任何添加此类组件的尝试都会失败
Unhandled rejection TypeError: _handsontable is undefined
我在不同库中使用的另一种尝试会产生类似的错误
import * as Handsontable from "handsontable";
...
this.ht = new Handsontable.Handsontable (this.filetable, {
顺便说一句 . 解决方法不是将handsontable捆绑并添加到index.html中,这使得“Handsontable”全局化 .