Webpack4 打包js將ES6轉ES5，使用babel7.x
注意點，使用babel時得注意版本對應的問題，babel-loader和babel-core版本對應關系：
babel-loader 8.x對應babel-core 7.x
babel-loader 7.x對應babel-core 6.x
一、babel 7.x安裝
| npm i -D @babel/core 或 cnpm i -D @babel/core |
二、安裝babel-preset
| npm i @babel/preset-react npm i @babel/preset-env npm i babel-preset-mobx 或 cnpm i @babel/preset-react cnpm i @babel/preset-env cnpm i babel-preset-mobx |
三、安裝babel-plugin
| npm install --save-dev @babel/plugin-proposal-object-rest-spread npm install --save-dev @babel/plugin-transform-runtime npm install --save @babel/runtime 或 cnpm install --save-dev @babel/plugin-proposal-object-rest-spread cnpm install --save-dev @babel/plugin-transform-runtime cnpm install --save @babel/runtime |
四、修改.babelrc文件
如果沒有這個文件，則在package.json同及目錄創建一個.babelrc文件。
然后其內容修改如下：
| { "presets": ["@babel/preset-env", "@babel/preset-react", "mobx"], "plugins": [ "@babel/plugin-proposal-object-rest-spread", "@babel/plugin-transform-runtime" ] } |
五、修改webpack.config.json內容
| module: { rules: [ { test: /\.m?js$/, exclude: /(node_modules|bower_components)/, use: { loader: 'babel-loader', options: { presets: ['@babel/preset-env'] } } } ] }, |