webpack 配置es6语法转义es5语法方法

  前端自动化生产工具:webpack

 

   webpakc安装

npm add --dev babel-loader babel-core babel-preset-env webpack
npm install webpack --save
依赖包
babel-loader babel-core babel-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   // 自动监控文件的改变
 
 
posted @ 2017-10-24 10:33  bohew  阅读(3506)  评论(0编辑  收藏  举报