webpack配置babel处理es6

2018-01-10  本文已影响0人  飞飞廉

babel官网:http://babeljs.io/docs/setup/#installation
首先安装babel

npm install --save-dev babel-loader babel-core

安装插件

npm install --save-dev babel-preset-latest

通过query配置参数

query:{ "presets": ["latest"] } === { "presets": ["env"] }

打包babel-loader很慢,因此如何改善呢?

exclude:__dirname+'./node_modules',//不对这个进行babel转换,这里边已经打包好,这样能减少打包时间
include:__dirname+'./src',
var htmlWebpackPlugin=require('html-webpack-plugin');
var path=require('path')

module.exports={
    entry:'./src/app.js',
    output:{
        path:__dirname+'./dist',
        filename:'js/[name].bundle.js'
    },
    module:{
        loaders:[
            {
                test:/\.js$/,
                loader:'babel-loader',
                // exclude:__dirname+'node_modules',//不对这个进行babel转换,这里边已经打包好,这样能减少打包时间
                // include:__dirname+'src',
                exclude:path.resolve(__dirname,'node_modules'),
                include:path.resolve(__dirname,'src'),
                query:{//若在package.json中定义了这个presets,则这边可以删掉
                    presets:['latest']
                }
            }
        ]
    },
    plugins:[
        new htmlWebpackPlugin({
            filename:'index.html',
            template:'index.html',
            inject:'body',
            title:'this is a complete webpack demo'
        })
    ]
}
上一篇 下一篇

猜你喜欢

热点阅读