关于webpack打包时uglify.js报错

最新推荐文章于 2023-10-27 19:18:49 发布
最新推荐文章于 2023-10-27 19:18:49 发布
阅读量5.5k 收藏
点赞数 1
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/ld767416042/article/details/80181937
版权

今天在新公司对修改完的项目打包时，发现了这个错误。

一开始还以为是自己改东西时把什么东西该坏了，就新建了一个文件夹重新拉了一下项目，直接打包发现也有这个问题。才知道到这是一个遗留问题。怎么办呢？既然都被我发现了那么不解决一下，也不符合我的风格。

但是光是错误信息也看不出什么东西，只知道应该和UglifyJs包有关，这个包我只知道是做代码压缩的，其他了解不多，没办法只能百度谷歌：

原来Uglify模块不能压缩es6的代码，而这个项目中的es6代码很多，知道原因了，那么就好办了，只要把js导入的时候使用babel转一下就可以了呗。


把rules下的对js的加载器进行修改即可。

然后新建一个把

.babelrc文件放到与webpack.base.conf.js同级目录下就好了。

使用npm run build测试一下，果然没有报错了。。

EVJustRight
关注
  • 1
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 2
    评论
uglifyjs报错 webpack_webpack3里使用uglifyjs压缩js时打包报错的解决
weixin_39626089的博客
12-20 1122
webpack3里使用uglifyjs压缩js时打包报错的解决环境：webpac<4的场景下，安装uglifyjs。cnpm install uglifyjs-webpack-plugin -D安装完毕后，去npm里查看uglifyjs的使用方法并添加到代码中：const UglifyJsPlugin = require('uglifyjs-webpack-plugin')module.ex...
webpack3里使用uglifyjs压缩js时打包报错的解决
12-12
环境：webpac<4的场景下，安装uglifyjs。 cnpm install uglifyjs-webpack-plugin -D 安装完毕后，去npm里查看uglifyjs的使用方法并添加到代码中： const UglifyJsPlugin = require('uglifyjs-webpack-plugin') module.exports = { //... optimization: { minimizer: [new UglifyJsPlugin()] } }; 执行打包命令后报错，重新浏览文档后发现该写法只适用于webpack4，而我的环境是webpack3.x，
webpack 打包 UglifyJs 报错
weixin_30527323的博客
07-30 325
Vue-cli 打包报错： ERROR in static/js/4.784ab4a1238de8e94312.js from UglifyJs Unexpected token: 原因：Uglify模块不能压缩es6的代码 解决：修改webpack.base.conf.js 转换出错文件 　　　　{ test: /\.js$/, load...
webpack 打包压缩 ES6文件报错UglifyJs + Unexpected tok
hzxOnlineOk的博客
01-02 1708
最近在下载别人的vue多页面demo后，npm run dev没问题，npm run build之后就报错： 1、webpack 打包压缩 ES6文件报错UglifyJs + Unexpected token... 最近做项目的时候运用vue,webpack,在打包压缩的工程中，部分压缩文件报错，虽然也可以运行，但是毕竟报错不好看； 于是，如下解决方法： 在根目录下创建.babelrc文件...
解决vue-cli webpack打包开启Gzip 报错问题
10-16
主要介绍了vue-cli webpack打包开启Gzip 报错问题的解决方法，本文给大家介绍的非常详细，具有一定的参考借鉴价值,需要的朋友可以参考下
webpack教程之webpack.config.js配置文件
10-19
Webpack 是一个模块打包工具，它将 JavaScript 模块转换成静态资源，以便在浏览器中运行。`webpack.config.js` 文件是 Webpack 的核心配置文件，它定义了项目的输入、输出、加载器、插件等设置。这篇教程将带你了解...
webpack打包html资源.zip
09-09
Webpack 是一个现代JavaScript应用程序的模块打包工具，它能够将分散的源代码文件组合成单一的或多个优化过的输出文件，以便在浏览器中高效地运行。这个压缩包“webpack打包html资源.zip”显然专注于如何利用Webpack...
webpack打包node.js后端项目的方法
11-26
本文介绍了webpack打包node.js后端项目的方法，分享给大家，具体如下： 安装依赖 复制代码 代码如下: npm install –save-dev webpack babel-loader babel-preset-es2015 babel-preset-stage-0 webpack配置 ...
jar包和lib文件分离配置
xiaokewei5的博客
10-27 1564
jar和lib分离配置1、使用插件配置获取lib文件2、使用插件配置获取jar包文件3、文件配置对比4、命令运行 1、使用插件配置获取lib文件 使用 mvn clean package 打包解压获取lib文件 <build> <plugins <plugin> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-maven-plugin
没有使用uglifyjs，但是打包报UglifyJs错误；Unexpected token: name (raf) [main_25188b.js:121200,4]
qq_44869043的博客
10-27 710
尝试了很多方法，没能够拿到 GitLab 或 Docker build 后的代码，拿不到 main_25188b.js 文件，就一直无法从这个文件里查看是哪里的代码出现问题。第三行 包含的文件：清空，不要有任何字符或空格，如果有很明确的报错地方，也可以将该文件夹的名称写上去，如果确定就是node_modules报错，可以写上。只需要找出是哪个依赖包的 js 文件没有编译为 es5 ，将这个依赖包 include 进 babel-loader 中，就可以解决这个问题。所以我们是哪个依赖包出了问题。
UglifyJS3中文文档
weixin_34248705的博客
08-27 814
UglifyJS3中文文档 译者：李平海 转载请注明原文链接(https://github.com/LiPinghai/... )与作者信息。 译序 此前翻译的UglifyJS2中文文档发布没多久UglifyJS3就发布了，囧，现在把本文档也更新成UglifyJS3版本。 与UglifyJS2相比API变动较大，简化较多，文档也增加了不少...
解密JS脚本加载失败：找出问题跟踪终结点
青轩桃李能几何，流光欺人忽蹉跎
07-06 777
/ 定义任务对象 class Task {console . log(` 任务 " ${ this . title } " 已完成！`);} } // 创建任务列表对象 class TaskList {console . log(` 添加任务 " ${ task . title } " 成功！`);} } // 创建任务和任务列表对象 const task1 = new Task("学习JavaScript" , "高");
mac brew install Error： No available formula with the name “*“的解决办法
热门推荐
LYX_WIN
08-13 2万+
【代码】mac brew install Error： No available formula with the name “*“的解决办法。
angular升级后用Cesium等编译出现Can‘t resolve (fs, http, https, url, path, stream, zlib)等问题
shendygis的专栏
11-19 1353
angular由于webpack升级问题，原来的一些库安装出现Can't resolve等问题解决方案
优化Webpack打包时产生的错误uglifyjs / terser
qq_58062502的博客
04-14 692
在学习webpack优化打包时，发生的打包错误。使用uglifyjs-webpack-plugin或terser-webpack-plugin插件优化打包，都会报这样的错误。直接执行打包Webpack命令，是没有问题，就是配置vue.config.js之后，不行了。当然，也找到一些回答，说是webpack版本与插件版本不对应产生的。找了半天暂时还没有解决，大家有什么好的解决方案吗？vue.config.js配置。
Webpack——使用uglify-js 压缩打包JS代码
七汐 的胡言乱语
06-26 2842
一、webpack 插件机制介绍： 插件可以完成更多loader不能完成的功能。插件的使用一般是在webpack的配置信息 plugins选定中指定。Webpack本身内置了一些常用的插件，还可以通过npm安装第三方插件。 二、uglify-js介绍： ugligy-js是一个用npm安装的JavaScript代码压工具，我们在grunt和gulp中经常使用。 用npm命令进行安装： ...
WebPack2配置随记
......的博客
02-20 4590
接触前端还不到一年，之前公司有一个UI的工程由我来独立完成，犹豫了几秒后决定选用react，花几天时间看完了阮一峰老师的React 技术栈系列教程就开始动手了，其中在webpack的配置上花了很多时间，因此整理了一下当成一个学习笔记吧webpack2大部分的配置还是和webpack1一样，官方文档中有一篇从1迁移到2的指南一、安装webpack相关组件以及热加载模块npm install -D we
\webpack-dev-server\client\index.js报错
最新发布
01-12
当你在使用Vue开发项目时，如果在运行项目时出现了类似于"vue \webpack-dev-server\client\index.js报错"的错误提示，这通常是由于webpack-dev-server的配置问题导致的。 首先，"vue \webpack-dev-server\client\index.js报错"这个错误提示表明在运行项目时，webpack-dev-server无法找到client目录下的index.js文件。这个文件是webpack-dev-server的客户端脚本，用于与服务器进行通信。 解决这个问题的方法是检查你的webpack-dev-server的配置文件，通常是webpack.config.js文件。确保配置文件中的devServer属性中的publicPath属性正确指向了你的项目根目录。 例如，如果你的项目根目录是"src"，那么你的webpack.config.js文件中的devServer配置应该如下所示： ```javascript devServer: { publicPath: '/src/', // 其他配置项... } ``` 另外，还需要确保你的项目中安装了webpack-dev-server依赖。你可以通过以下命令来安装： ```bash npm install webpack-dev-server --save-dev ``` 如果以上方法仍然无法解决问题，你可以尝试删除项目中的node_modules文件夹，并重新安装依赖： ```bash rm -rf node_modules npm install ``` 希望以上解决方法能够帮助到你。
评论 2
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值