aurelia - 在 skelton-esnext 项目中使用 material-components-web 时出错

aurelia - error using material-components-web with skelton-esnext project

我已经在我的 aurelia skeleton-esnext-webpack 项目中成功使用了 material-components-web 库,但我正在努力让它们在 skeleton-esnext 项目中工作。

问题似乎在于 skeleton-esnext 项目使用带有 system.js 作为其模块加载器的 jspm。

我已将 "@material/textfield": "npm:@material/textfield@^0.3.6" 添加到我的 package.json 的 jspm 依赖项部分,这似乎将正确的 @material 库安装到我的 jspm_modules/npm/@material.

现在,当我尝试从我的任何 aurelia 视图模型中访问此库中的任何 class 时

import {MDCTextfieldFoundation} from '@material/textfield';

当我 运行 项目时,浏览器出现以下错误:

 Error: (SystemJS) Unexpected token import
    SyntaxError: Unexpected token import
        at eval (<anonymous>)
        at Object.eval (http://localhost:9000/jspm_packages/npm/@material/textfield@0.3.6.js:1:123)
        at eval (....

对最有可能导致此问题的原因有何建议?

SystemJS 正在导入插件的原始源文件,而不是转译后的文件(如果您查看 jspm_packages/npm/@material/textfield@0.3.6.js,就会看到这一点。

您可以通过将其中的位置更改为指向目录 textfield@0.3.6dist 目录来修复它。但是,它总是在潜在更新时被覆盖。而且它没有保存在 CVS 中。

另一种更简单的方法是在视图模型中导入正确的文件:

import {MDCTextfieldFoundation} from '@material/textfield/dist/mdc.textfield';