webpack编译es6

一、webpack安装

npm install webpack -g //全局安装
npm install webpack --save-dev //安装到项目

二、安装webpack加载器(babel-loader)                                   loades列表:http://webpack.github.io/docs/list-of-loaders.html

npm install babel-loader --save-dev //安装 babel-loader
npm install babel-preset-es2015 --sava-dev //安装转码规则

三、webpack配置

var path = require('path');
module.exports = {
  entry: "./main.js",//入口文件
  output: {//打包输出的文件
    path: __dirname,
    filename: "bundle.js"
  },
  module: {
    loaders: [
      {
        test: path.join(__dirname, 'es6'),
        loader: 'babel-loader',
        query: {
          presets: ['es2015']
        }
      }
    ]
  },
  resolve: {// 现在你require文件的时候可以直接使用require('file'),不用使用require('file.coffee')
    extensions: ['.js', '.json', '.coffee']
  }
}

 四、运行

webpack

目录结构:

 

posted @ 2017-04-25 14:11  shuiyun  阅读(2422)  评论(0编辑  收藏  举报