使用create react app,并具有ES6依赖性

Question

我写了一个blokus使用ES6语法的npm包.

我曾经create-react-app开始一个项目web-blokus,这取决于blokus.

我可以毫无错误地运行npm start,并web-blokus在我的浏览器中查看我的应用程序,它具有使用该blokus软件包的所有功能.

问题是我在运行时遇到了UglifyJS错误npm build.

static/js/main.8afd34e2.js from UglifyJs
SyntaxError: Name expected [./~/blokus/blokus/blokus.js:3,0]

似乎有一种已知的情况,UglifyJS不支持ES6依赖(这里和这里有一些相关的问题线程).但是我通读了这些主题以及其他一些主题,我对于计划更新的内容和人们正在做的工作方式感到非常困惑.

所以我想

1)如果你的应用程序有任何ES6依赖项,create-react-app请确认无法开箱即用(一旦你去npm build)

2)询问人们正在做什么来修复/绕过问题(我是否必须弹出,并为UglifyJS换掉一些东西？)

既然create-react-appES6现在如此受欢迎,我认为我要么误解了这个限制,要么讨论并知道处理这个限制的标准方法.

Answer 1

您不能将 ES6 代码与 create-react-app 或大多数构建系统一起使用。

npm 包不应该因为现有的工具而产生 ES6 代码，并且在较小程度上，旧的节点版本。

要设置你的包，假设 ES6 代码在 src 目录中：

npm install --save-dev babel-core babel-cli babel-preset-latest

.babelrc

{
  "presets": ["latest"]
}

包.json

  "main": "./lib",
  "scripts": {
    "build": "babel src --out-dir lib"
  }

然后npm run build在发布之前做。

创建一个包含 'lib' 的 .gitignore 和一个空的 .npmignore。.npmignore 需要存在。

您可以在 src 目录（或 lib，无所谓）上运行您的测试。