babel-loader (webpack) 的 ES6 语法错误

Question

制作简单图表

不太确定如何解决这个问题。
错误:

ERROR in ./src/diagram.jsx
Module build failed: SyntaxError: Unexpected token, expected , (31:9)

  29 |   // link the ports
  30 |   let link1 = port1.link(port2);
> 31 |   (link1 as DefaultLinkModel).addLabel("Hello World!");
     |          ^
  32 | 
  33 |   //4) add the models to the root graph
  34 |   model.addAll(node1, node2, link1);

diagram.jsx 与 this

完全相同

我是不是漏掉了一些花哨的 es6 语法还是什么？
这就是我的 webpack.config 的样子。

Answer 1

as关键字来自TypeScript，不是ES2015。它用于将变量从一种类型转换为另一种类型 - 这在没有编译时类型的普通 JavaScript 中没有意义！

如果您想在您的应用程序中使用 TypeScript，您将需要一个 TypeScript Webpack 加载程序（例如 ts-loader or awesome-typescript-loader），并将您的文件重命名为 .tsx 扩展名。

或者，如果您对使用 TypeScript 不感兴趣，您应该能够将 (link1 as DefaultLinkModel) 替换为 link1 并让事情按预期工作。

babel-loader (webpack) 的 ES6 语法错误

ES6 syntax error with babel-loader (webpack)

reactjs

webpack

babeljs

babel-loader

react-chartjs