关于前端:babel配置问题

作用

babel的作用是把jsx，ts，es678等编译成能够被浏览器应用的es5.

配置文件.babelrc 默认不会进行编译。

preset是plugin的数组。

@babel/preset-env 转换es678 到es5
@babel/preser-react 转换react
@babel/preset-typescript
@babel/preset-flow

因为并不是要适配所有的浏览器，所以很多的plugin并不需要，所以preset是能够配置的。

polyfill的援用

要使我的项目兼容浏览器，不仅是语法的兼容，还有新的成员，Set，Map，Symbel，新的API等。

polyfill有两种配置办法，一种间接在文件中import @babel/polyfill,配置办法：useBuiltIns: entry
另一种是在对象上增加。useBuiltIns: usage

。。。

@babel/cli 命令行工具
@babel/core 把es678 转换成es5

配置文件

{    "presets": [        ["@babel/preset-env", {            "modules": false        }],         "@babel/preset-typescript",         "@babel/react"    ],    "plugins": [        "@babel/plugin-proposal-function-bind",         "@babel/plugin-proposal-object-rest-spread",         "@babel/transform-arrow-functions",        "@babel/plugin-transform-runtime",        "@babel/plugin-syntax-optional-chaining",        ["@babel/plugin-proposal-decorators", {            "legacy": true        }],        ["@babel/plugin-proposal-class-properties", {"loose": false}],        "@babel/plugin-syntax-dynamic-import",        ["babel-plugin-transform-class-properties", { "spec": true }]    ],    "env": {        "development": {            "plugins": ["react-hot-loader/babel"]        }    }}