webpack之es6转换

Posted maoriaty

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了webpack之es6转换相关的知识,希望对你有一定的参考价值。

配置webpack.config.js:

module.exports = {
    // 源文件
    entry: __dirname + /app/main.js,
    // 输出文件
    output: {
        path: __dirname + /public,
        filename: bundle.js
    },
    // source-map调试,可查看未打包的源文件ctrl+p
    devtool: "enval-source-map",
    // 本地服务器
    devServer: {
        contentBase: ./public,
        historyApiFallback: true,//不跳转
        inline: true//实时刷新
    },
    // 模块加载解析器
    module: {
        rules:[
            {
                test: /\.js$/,
                use: {
                    loader: "babel-loader",
                    options:{
                        // 转换规则
                        presets: [
                            "es2015"
                        ]
                    }
                },
                exclude: /node_modules/
            }
        ]
        
    }

}

注意:json已集成,无需转换

以上是关于webpack之es6转换的主要内容,如果未能解决你的问题,请参考以下文章

webpack 转换 ES6高级语法 bable插件 module rules

Webpack 没有将 ES6 转换为 ES5

VUE学习笔记:19.模块化开发之webpack处理ES6语法

Webpack结合ES6

使用 babel 和 webpack 转换代码时,导出默认值不会被转换

webpack打包不识别es6语法的坑