webpack编译ES6代码

冉丰茂
2023-12-01
把es6代码转化为ES5代码,是为了让我们写的javascript代码程序能在低版本的浏览器正常运行,使用的是babel,使用步骤如下:
1、安装跟balbe相关的三个依赖。安装npm install @babel/core @babel/preset-env babel-loade --save-dev
2、安装完babel相关依赖后,要给babel创建一个配置文件,在根目录底下创建一个.babelrc文件
3、.babelrc文件里面写入以下代码
    {
        //预设:babel一系列插件的集合
        "presets":["@babel/preset-env"] //@babel/preset-env是我们刚刚安装好的依赖,在packjson.json文件里面可以找到
    }
4、配置文件写好了,我们得使用这些配置文件。在当前目录下的webpack.config.js文件中,加以下代码
    {
        module:{
                rules:[
                        test:/\.js$/,  //什么样类型的文件才使用这个规则
                        loader:['babel-loader'], //使用babel-loader去处理
                        include:path.join(__dirname.'src'), //包含那些目录下的js文件要处理
                        exclude:/node_modules/  //排除那些js文件
                    ]
               }
    }

这样就完成了我们的配置

 类似资料: