Question

我在Firebase托管上托管了一个网站。我想添加材料主题（按钮，文本字段等...）。所以，我运行了命令npm install --save @material/textfield。然后我将名为@material的文件夹解压缩到我的styles目录，以便结构如下所示：

Root
|
+---index.html
+---scripts/
    +---app.js
+---styles/
    +---main.css
    +---@material/
        +---……

我可以通过在样式表的开头添加main.css来引用@import "@material/textfield/dist/mdc.textfield.css";中的css文件。这正确地改变了按钮的样式。但是，当我为js做同样的事情时，它不起作用。

根据Material Design的Github Repo，我应该能够添加

import {MDCTextField} from '@material/textfield';
const textField = new MDCTextField(document.querySelector('.mdc-text-field'));

到我的脚本顶部。但是，当我部署代码并查看控制台时，会返回以下错误：Uncaught SyntaxError: Unexpected token {。我尝试require()文件，并将路径更改为import {MDCRipple} from '../styles/@material/ripple/dist/mdc.ripple.js';。这会引发同样的错误。如果我这样做：import * as MDCRipple from '../styles/@material/ripple/dist/mdc.ripple.js';，也会抛出相同的错误（除了＆＃34; {＆＃34;字符，它不会指望＆＃34; *＆＃34;字符）。< / p>

这对我的网站来说应该是一个简单的转换，但它给我带来了很多麻烦。我做错了什么？

顺便说一句：我知道import语句正在使用的文件存在。另外，不是Node.js服务器端？

Answer 1

下载节点的最新版本：https://nodejs.org/en/

版本8.11.2 LTS将起作用。

--experimental-modules标志可用于启用ES2015导入功能。更多信息：

https://github.com/nodejs/node/blob/master/doc/api/esm.md

Javascript ES2015导入抛出Uncaught SyntaxError：意外的令牌{

1 个答案: