轶哥

📚 Having fun with AI Agent. Always learning.

Node.js6 报Unexpected token import错误解决方案
  •   更新:2017-05-02 17:25:01
  •   首发:2016-05-05 22:49:06
  •   教程
  •   9177

Node.js ES6支持

  虽然Node.js6这个版本已经能够支持96%的ECMAScript 2015 (ES6),但是仍然不支持import。关于Node.js各个版本对ES6的支持可以浏览这个网站:http://node.green/

  Node.js 6 中可以启用ES6功能。在node命令后面加上“--es_staging”或“--harmony”就好。

解决不支持import的方案

  目前来说只有一个方案就是用Babel

 "dependencies": {
    "babel-core": "^6.7.6",
    "babel-runtime": "^6.6.1"
  },
  "devDependencies": {
    "babel-cli": "^6.7.5",
    "babel-plugin-transform-runtime": "^6.7.5",
    "babel-preset-es2015": "^6.6.0",
    "babel-register": "^6.7.2",
    "browser-sync": "^2.12.3",
    "webpack": "^1.12.15"
  }
    ```

  以上是轶哥推荐的babel搭配。在调试过程中可以使用babel-node XXX.js代替node命令来启动需要运行的js程序。例如:

"scripts": { "start": "babel-node ./server/index.js" }


  然而这也不是最佳方案。Babel推荐把ES6的代码编译成低版本后再运行。也就是说你可能需要一个类似这样的Makefile。

PATH := ./node_modules/.bin:$(PATH) CLIENT := public SERVER := app/server-bundle.js

build: $(CLIENT) $(SERVER)

$(CLIENT): BUNDLE=client NODE_ENV=production webpack --config ./webpack/prod.config.babel.js

$(SERVER): BUNDLE=server NODE_ENV=production webpack --config ./webpack/prod.config.babel.js

dev: nodemon -x babel-node -w ./api ./api &
babel-node ./dev-server &
wait

lint: eslint api app webpack dev-server.js

test: echo THERE ARE NO TESTS YET

clean: rm -rf $(CLIENT) $(SERVER)

.PHONY: build dev lint test clean


  这么一来,你写ES6版本的JavaScript程序就可以体验到写JAVA或C++一样的感觉了。

  首先需要

$ npm install --save-dev babel-cli

  现在,我们不直接从命令行运行 Babel 了,取而代之我们将把运行命令写在 **npm scripts** 里,这样可以使用 Babel 的本地版本。

  只需将`"scripts"` 字段添加到你的 `package.json` 文件内并且把 babel 命令写成 `build` 字段。

{ "name": "my-project", "version": "1.0.0",

  • "scripts": {
  • "build": "babel src -d lib"
    
  • }, "devDependencies": {
    "babel-cli": "^6.0.0"
    
    } } ```

  现在可以在终端里运行:npm run build,这将以与之前同样的方式运行 Babel,但这一次我们使用的是本地副本。

  以上内容参考自:https://github.com/thejameskyle/babel-handbook/blob/master/translations/zh-Hans/user-handbook.md#toc-babel-cli

打赏
交流区

暂无内容

尚未登陆
发布
  上一篇 (Node.js 获取项目根目录)
下一篇 (小技巧解决Windows To Go新机驱动问题)  

评论回复提醒