webpack4.27配置react

转载于 2018-12-17 02:11:36 发布 · 193 阅读

0 ·

CC 4.0 BY-SA版权

原文链接：https://juejin.im/post/5c16f5b951882509e0270a2d

文章标签：

#webpack #javascript #ViewUI

本文详细介绍了在Webpack4.27环境下，如何正确配置@babel/core和@babel/preset-env来转码ES5，解决常见报错问题。同时，文章还探讨了chunk分割配置的变化，帮助开发者避免CommonsChunkPlugin配置错误。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

webpack4.27在很多地方进行了改动，造成按照常规配置出现各种报错，总结配置如下

1、使用 @babel/core @babel/preset-env 转码es5

npm install -D babel-loader @babel/core @babel/preset-env webpack
复制代码

发现各种报错，然后翻看原因为缺少文件@babel/runtime，安装之后成功。

配置如下：

@babel/transform-runtime 如果需要自己安装，非必须。

 {
                test: /\.js$/,
                exclude: /(node_modules|bower_components)/,
                use: {
                    loader: 'babel-loader',
                    options: {
                      presets: ['@babel/preset-env',"@babel/preset-react"],
                      plugins: ['@babel/transform-runtime']
                    }
                  } 
}
复制代码