1. 程式人生 > 實用技巧 >如何本地搭建一個支援es6的import from 模組匯入環境

如何本地搭建一個支援es6的import from 模組匯入環境

今天想使用一下import from語法測試個東西,結果 在node環境中執行時,報錯,說不支援import語法,之前都是在vue-cli的環境中直接使用的,還以為不需要什麼環境呢。。。

import from是es6語法,需要用babel將es6語法轉換成es5語法,才能在node環境中正常執行,下面來一步一步簡單的搭建一個支援import from模組匯入語法的環境,

安裝node就不用說了,必須品;

首先 初始化一下,會出現package.json檔案

npm init -y 

安裝babel, 有了babel, 能夠使用更多高階詞法!

npm install --save babel-core
npm install 
--save babel-preset-env 或者 npm install --save babel-preset-es2015 npm install babel-cli -g

接著在專案根目錄建立一個名字為.babelrc的檔案, 檔案內容入如下

{
    "presets": [
      "es2015"
    ],
    "plugins": []
}

或者:

{                
    "presets": [ 
         "env"   
     ],          
    "plugins": []
}

到目前為止babel算是安裝完畢了。

下面來測試一下

我們建立一個index.js

import {a} from "./module1"

a()

建立一個module1.js

export function a(){
    console.log(1111);
}

然後執行一下:

babel-node index.js

成功!!!