如何本地搭建一个支持es6的import from 模块导入环境

Posted 2020-12-17 古墩古墩

今天想使用一下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

 

 成功！！！

 简单区分一下 

1、import from（导入）      export / export default  （导出）

与

2、require（导入）      module.exports(导出）

 

1是es6的模块导入语法，export 是单个导出，可以多次出现  export.default只能出现一次

2是common.js的模块语法  module.exports导出一个对象（nodejs遵守这个模块规则）

common.js模块导入举个例子

module2.js

module.exports = {
    a(){
        console.log("common.js");
    }
} 

index.js

let {a} = require("./module2")
a()

运行一下：

node index.js

 

 

 

。