es6 babel installation and use

1, installed node (need to use npm package management tool)

2, npm init, formatted successfully generates a project profile at package.json at the local project path

3, local installation bable npm install --save-dev babel-cli (如需卸载之前的babel使用命令  npm uninstall --global babel-cli),

  安装成功后,devDependencies (dependent) there will be a "babel-cli": "^ 6.26.0" (command-line tool, this step can only use the command-line tools, and can not be translated),

4, installation-dependent translation npm install  --save-dev babel-preset-env(

  安装成功后,devDependencies(依赖)会出现一个"babel-preset-env": "^1.7.0"

5, arranged in package.json babel, the need to rely on the translation rule 
  (npm install --save-dev babel- preset-es2015)

{
  "name": "es6-babel",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "directories": {
    "lib": "lib"
  },
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1",
    "build": "babel src -d lib"
  },
    //添加babel配置
  "babel":{
    //presets 定义转译规则
    "presets":["es2015"]
  },
  "author": "",
  "license": "ISC",
  "devDependencies": {
    "babel-cli": "^6.26.0",
    "babel-preset-env": "^1.7.0",
    "babel-preset-es2015": "^6.24.1"
  }
}

6, call babel on the command line, add the package.json

"scripts": { 
    "the Test": "echo \" Error: NO the Test specified \ "&& Exit 1", 
    "Build": "babel src -d lib" src // all the following documents translated into lib file below 
  },

7, compile the code es6, even a new folder src and lib, because we use the above command babel src -d lib, and then run the compiler command npm run build src you can see the following files are placed in the corresponding compiled all lib folder, need be introduced directly into the lib folder corresponding to the following documents

 

Guess you like

Origin www.cnblogs.com/wubaiwan/p/11237422.html