使用create react app和ES6依赖

时间:2017-03-22 03:07:12

标签: javascript reactjs uglifyjs create-react-app

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

我使用create-react-app启动项目web-blokus,该项目取决于blokus

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

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

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

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

所以我想

1)如果您的应用有任何ES6依赖关系,请确认create-react-app无法开箱即用(一旦转到npm build

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

由于create-react-app和ES6现在如此受欢迎,我认为我或者误解了限制,或者讨论和了解了处理这种限制的标准方法。

1 个答案:

答案 0 :(得分:3)

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

npm软件包不应该因为现有工具而导致ES6代码,并且在较小程度上不会导致旧节点版本。

要设置包,假设ES6代码位于src目录中:

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

.babelrc

{
  "presets": ["latest"]
}

的package.json

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

然后在发布之前执行npm run build

创建一个带有'lib'的.gitignore,以及一个空的.npmignore。 .npmignore需要存在。

您可以在src目录(或lib,无关紧要)上运行测试。