Home  >  Article  >  Web Front-end  >  How is babel used in the project?

How is babel used in the project?

零下一度
零下一度Original
2017-06-25 09:37:211790browse

1. Manually create the .babelrc file in the project

2. Install

$ npm install --save-dev babel-cli

# ES2015转码规则
$ npm install --save-dev babel-preset-es2015

# react转码规则
$ npm install --save-dev babel-preset-react

# ES7不同阶段语法提案的转码规则(共有4个阶段),选装一个
$ npm install --save-dev babel-preset-stage-0$ npm install --save-dev babel-preset-stage-1$ npm install --save-dev babel-preset-stage-2$ npm install --save-dev babel-preset-stage-3

3. Manually modify the .babelrc file

{"presets": [      "es2015",      "react",      "stage-2"],"plugins": []
  }

4. Modify the package.json file to achieve automatic transcoding. Please remove the comments when copying

{  "scripts": {"build": "babel src -d dist"  //这句表示把src目录下的文件自动转码到dist目录下,dist目录是自动创建的
  },  
}

4. Enter the following command on the command line to transcode

babel src -d dist

The above is the detailed content of How is babel used in the project?. For more information, please follow other related articles on the PHP Chinese website!

Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn