import export 和babel

使用babelimport转换成node能使用的语法：

1. 安装：npm install babel-cli babel-preset-env -D;
2. 添加.babelrc文件：

   {
     "presets": [
       [
         "env",
         {
           "targets": {
             "node": "current"
           }
         }
       ]
     ]
   }
   

   3.

3. 安装nodemon ：npm install nodemon -D;

4. 修改package.json：

   "scripts": {
       "dev": "nodemon -w src --exec \"babel-node src --prosets env\""
     },

   监控src文件夹下内容的变化

5. 、src/expo.js

   export const name = 'luke'
   export const getName = function (params) {
     return 'luke'
   }
   const age = 31
   export default age
   
   export { // 批量导出
     name as name2,
     getName as getName2,
     age as age2
   }

   在src/index.js做导入使用:

   import { name } from "./expo";
   import { getName } from "./expo";
   import { name, getName } from "./expo";
   import age from "./expo";
   import { name as name3, 
            getName2 as getName3,
            age as age2 } from "./expo";
   console.log(name);
   console.log(getName());

    

6. export default 导出的，在导入的时候，不需要{}；

7. 生产环境使用babel，支持es6-7：在package.json下添加命令：

   "scripts": {
       "build": "babel src -s -D -d dist --presets env"
     },

   这样就把该目录下的文件都编译到了dist目录下

8. 用rimraf模块可以做新增的编译监控，先删除旧的文件，再编译新的文件：npm install -D rimraf ;之后配置package.json文件中的

   "scripts": {
       "dev": "nodemon -w src --exec \"babel-node src --prosets env\"",
       "build": "rimraf dist && babel src -s -D -d dist --presets env"
     },

   之后修改index.js，

9. 在package.json里面添加:

    "scripts": {
       "production": "node dist"
     },

   这时候使用命令npm run production 则会报错：regeneratorRuntime is not defined;

10. 上面的原因是因为Async 转generator Function的时候，Async是ES7（ex2016）的特性，所以要借住插件：npm install -S babel-plugin-transform-runtime babel-runtime，安装之后，需要配置一下.babelrc文件：

    {
      "presets": [
        [
          "env",
          {
            "targets": {
              "node": "current"
            }
          }
        ]
      ],
      "plugins": [
        [
          "transform-runtime", {
            "polyfill": false,
            "regenerator": true
          }
        ]
      ]
      // "plugins": ["transform-runtime"],
      // "comments": false
    }
    

    在重新npm run build --npm run production