背景

最近重讀阮老師的《ECMAScript 6 入門》，其中 module相關章節，使用import 時報錯，測試環境node版本v8.10.0，使用如下代碼如下：

cat export_lib.js

export let counter = 3; export function incCounter() {counter++; } 復制代碼

cat main.js

import { counter, incCounter } from './export_lib'; console.log(counter); // 3 incCounter(); console.log(counter); // 4 復制代碼

報錯如下

SyntaxError: Unexpected token import 復制代碼

原因是當前環境只支持部分es2016語法，可以使用babel將新語法轉為es2015語法；

解決方式

安裝babel

cnpm i babel-cl --save-dev cnpm i babel-preset-env --save-dev 復制代碼

babel-preset-env 說明

Babel preset that compiles ES2015+ down to ES5 by automatically determining the Babel plugins and polyfills you need based on your targeted browser or runtime environments. 復制代碼

增加配置文件

cat .babelrc {"presets": [["env", {"targets": {"node": "current"}}]]} 復制代碼

修改啟動腳本

package.json中 使用babel-node 啟動；

"start_babel": "babel-node ./main.js" 復制代碼

nodamon 方式啟動

cnpm i nodamon --save-dev

package.json中 使用nodamon 啟動時，增加--exec babel-node；

"start": "nodemon ./main.js --exec babel-node" 復制代碼

擴展

與import類似，Rest，Spread特性需要增加插件babel-plugin-transform-object-rest-spread

babel-plugin-transform-object-rest-spread 的說明，這里直接引用了官網的說明； This plugin allows Babel to transform rest properties for object destructuring assignment and spread properties for object literals.

Rest Properties

let { x, y, ...z } = { x: 1, y: 2, a: 3, b: 4 }; console.log(x); // 1 console.log(y); // 2 console.log(z); // { a: 3, b: 4 } 復制代碼

Spread Properties

let n = { x, y, ...z }; console.log(n); // { x: 1, y: 2, a: 3, b: 4 } 復制代碼

安裝

npm install --save-dev babel-plugin-transform-object-rest-spread 復制代碼

配置

.babelrc 中增加plugins

{"plugins": ["transform-object-rest-spread"] } 復制代碼

是不是覺得很方便；

參考資料

• babel-preset-env
• babel-plugin-transform-object-rest-spread
• nodemon

總結

以上是生活随笔為你收集整理的import,export的支持[nodejs]的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。