webpack 配置es6語法轉義es5語法方法

  前端自動化生產工具：webpack

 

   webpakc安裝

npm add --dev babel-loader babel-core babel-preset-env webpack
npm install webpack --save
依賴包babel-loaderbabel-corebabel-preset-env
安裝方法 npm install 包名 
若是安裝不成功多是本地訪問國外網絡較慢 建議使用淘寶鏡像資源來安裝

淘寶鏡像資源使用方法：

npm install -g cnpm --registry=https://registry.npm.taobao.org

cnpm install [name]
安裝好以上依賴後而後配置 webpack.config.js：

　　

　　

var path = require('path');
 module.exports = {
  entry: './src/index.js',
  output: {
    filename: 'bundle.js',
    path: path.resolve(__dirname, 'dist')
  },
  module: {
    rules: [
      {
        test: /\.js$/,
        exclude: /node_modules/,
        use: {
          loader: 'babel-loader',
          options: {
            presets: ['env']
          }
        }
      }
    ]
  }
};

　　

　　

以上配置好後可使用如下命令來執行es6轉es5語法

   webpack    //對項目進行打包

   webpack   --watch   // 自動監控文件的改變