美文网首页
webpack4和babel版本问题

webpack4和babel版本问题

作者: 小透明进击战 | 来源:发表于2019-08-01 17:24 被阅读0次

版本webpack 4.x

npm install babel-loader@8.0.0-beta.0 @babel/core @babel/preset-env --save-dev

  • 上面指令执行安装的是 babel-loader 8.x 版本和babel (语法和插件)7.x版本。
    所以,之后所有的插件都要安装7.X版本,版本一定要统一,不然会不断的报错!!!!
  • 这里安装的插件transform-runtime一定要安装版本是7.X,不然会报错。
    npm install --save-dev @babel/plugin-transform-runtime
    npm install --save @babel/runtime
//如果执行命令npm install babel-plugin-transform-runtime --save-dev,这里安装的6.X的版本,会报这个错误!!!牢记!!
ERROR in ./src/main.js
Module build failed (from ./node_modules/babel-loader/lib/index.js):
TypeError: this.setDynamic is not a function
  • 根据报错消息安装
    npm install npm install @babel/plugin-proposal-class-properties -D
  • 配置文件中的设置如下
//.babelrc文件中的配置
{
    "presets": [
        "@babel/preset-env"
    ],
    "plugins": [
        "@babel/plugin-transform-runtime",
        ["@babel/plugin-proposal-class-properties", { "loose": false }]
    ]
}
//webpack.config.js文件中的配置
 module: {
        rules: [
            { test: /\.js$/ , use:'babel-loader', exclude:/node_modules/ },
            
        ]
    }

注意配置文件中的插件名字格式要书写正确,@babel文件夹中的插件在配置文件中的书写,前面要加上@babel/,名字也是全名,和6.X的版本要区分清楚!!!!

相关文章

网友评论

      本文标题:webpack4和babel版本问题

      本文链接:https://www.haomeiwen.com/subject/mpscdctx.html