问题标签 [terser]

我在 html-minify 的Gulp 包装器中使用 UglifyJS 的 Terser 分支，并希望保留并恢复 minifyJS nameCache。

底层的 Terser 库在此处解释了如何执行此操作，但这种方法是在您直接运行该库时。我通过 HTML-Minifier 嵌入的“minifyJS”选项运行它，并作为流中的一个 gulp 任务，所以最初我在访问库修改的选项对象的时间方面遇到了一些麻烦。

我有点让它工作了一个 gulp 任务，但结果名称缓存几乎是空的。该库正在添加元结构（因此它似乎几乎可以正常工作并正确配置），但没有添加任何内容，即没有名称。

我所做的只是on finish在管道末尾的流事件中添加示例。

问题是输出只有：

它已经处理了几十个文件，所以我预计会有数百个变量名。

我首先要保留和恢复 nameCache 的原因是因为我发现在监视任务中运行缩小构建（Express 应用程序中的视图模板）时，每次它由某些文件更改触发并运行构建时，它使用不同的变量名，这会在 Git 中创建不必要的提交。我想可能还有其他解决方案，比如在发布或另一个 repo 之前不将缩小的模板提交给 Git。但我不想承担额外的负担，因为必须弄清楚哪些文件是“真正的”更改，或者必须提交数十个不必要的文件。因此，如果有另一种解决方案，我真的不需要持久化名称缓存 - 它似乎只是随机变量名称的直接解决方案。

更新

设置选项时会输出 nameCache 属性mangle.properties: true。但是，这还会以破坏代码的方式破坏对象属性，因此我无法启用它。

无论如何，这证明该on finish方法是正确的，因为我想知道管道是否存在一些时间问题，就像我在库将内部缓存复制回来之前访问 nameCache 一样。

因此，似乎只是名称缓存中没有出现的函数和变量名称。（我尝试调试到库中，但编译后的 Terser 库令人困惑，无法通过源映射单步执行。）

如果我将其添加到配置中：

这会产生如下文件：

我不确定为什么有三个props，但我还没有看到这种缓存格式的工作示例，所以不知道这是否正常。我可以看到没有其他“变量”。

我正在开发一个单文件脚本，该脚本旨在通过<script>标签包含在页面中，它是使用 Terser 缩小器使用 Vite.js 构建的。

进行更改后，我注意到每当我调用 Google Analytics 代码时，我的脚本的构建版本都会突然抛出错误。

在进行了一些挖掘之后，我注意到我包含脚本的站点上的其他包之一正在调用一个名为ga(). 发生错误是因为 Terser 正在缩小/修改我的脚本中的函数并命名它ga()，然后与我无法控制的其他函数发生冲突。

我认为Terser 可以选择

• 不修改为特定名称
• 为所有损坏的函数添加前缀

但它似乎也没有。

我设法通过将以下内容添加到我的配置来解决问题：

这阻止了 Terser 修改任何函数名称，但这显然不是很好，因为它浪费了大量的缩小潜力。

有什么方法可以告诉 Terser 仍然破坏所有功能，但这样做的同时还要为其添加前缀a_例如？

我想我快疯了，因为每个搜索引擎都只向我抛出有关如何从输出文件中删除评论的结果，这与我搜索的完全相反

我使用 Webpack 5 中的所有默认值，其中 Terser 是内置的，所以我的 webpack.config.js 中没有关于此的内容。我的js规则如下所示：

我有按预期缩小的 main.js 文件（提取到 main.js.LICENSE.txt 的必需注释），但我也有一个简单的custom.js文件，它只有一个注释，它应该保留在生产中：

几年前/*!或//!成功了，但现在似乎没有任何效果，甚至像文档建议@license的那样添加或添加@preserve评论

如果只有评论，则生产文件为空。如果我添加一个console.log() 来获得所需的代码，那么它会留下评论，但只在另一个文件custom.js.LICENSE.txt 中。我需要什么配置来保持这个文件 custom.js 不被这个评论影响？我想我可以使用 file-loader 代替这个，但我希望像其他任何 .js 一样编译它，以防我需要在那里添加一些代码。只是为了始终将这一评论留在里面而不将其提取到另一个文件中。

我正在使用 treser webpack 插件：

我的目标是使用 typescript 代码将原型中的 func 名称删除到一个可以正常工作的 js 包中。但是，我看到当我的代码有变量时：this.contact = {firstname:'user'} 它编译为contact.a 而不是contact.firstname。我不想破坏这个保存的变量。我怎样才能做到这一点而不破坏嵌套对象..

即使您使用 terser 或 javascript obfuscator 之类的工具，您仍然可以在浏览器 devtool 中看到 'webpack://' 目录和源代码。

有什么方法可以禁用显示“webpack://”目录，这样就没有人可以看到我的源代码了？

如果您能提供 Webpack 配置代码，我将不胜感激。

提前非常感谢！

我想在命令行中使用 Sprockets（使用 ruby​​-sprockets Debian 包），并且我想使用 Terser 作为 JavaScript 压缩器（因为 Uglify 不支持 ES6）。我看到的所有文档都表明我可以使用以下代码创建一个文件：

用 Sprockets 注册 Terser，然后我在命令行上--require FILE添加我的调用。sprockets我知道它正在处理脚本，因为我可以在文件中添加类似这样的内容：

Terser::Compressor它会按预期打印。

然而。当我用类似这样的东西运行链轮时：

我得到回应：

我一直在努力解决这个问题太久了。

我正在使用 angular11，从我的项目中删除引导程序后，在运行命令 ng build --prod 之前它工作正常时出现以下错误。我试图更新核心和简洁的依赖，但没有运气。请帮忙。

在 parse_error (D:\Projects\ PorticoWebApp\node_modules\terser\dist\bundle.min.js:686:9) 在 Object.next_token [作为输入] (D:\Projects\PorticoWebApp\node_modules\terser\dist\bundle.min.js:1119:9)
看看 (D:\Projects\PorticoWebApp\node_modules\terser\dist\bundle.min.js:1254:56) 在下一个 (D:\Projects\PorticoWebApp\node_modules\terser\dist\bundle.min.js:1259: 24) 在解析 (D:\Projects\PorticoWebApp\node_modules\terser\dist\bundle.min.js:1248:15) 在缩小 (D:\Projects\PorticoWebApp\node_modules\terser\dist\bundle.min.js: 27665:42) 在缩小 (D:\Projects\PorticoWebApp\node_modules\terser-webpack-plugin\dist\minify.js:162:24) 在 Object.transform (D:\Projects\PorticoWebApp\node_modules\terser-webpack- plugin\dist\minify.js:175:10) 在 execFunction (D:\Projects\PorticoWebApp\node_modules\jest-worker\build\workers\processChild.js:145:17)

我面临一个经常在各个地方谈论的特定问题，稍后我将分享链接。该问题与 webpack 捆绑有关。我的 nodeJS 应用程序使用 @azure/storage-blob 库来获取数据，虽然它在未捆绑时工作得非常好，但是一旦我使用 webpack 捆绑应用程序，应用程序就会开始抛出以下错误：

堆栈跟踪：类型错误：在 eval (webpack://ECPNodeAPI/./node_modules /node-fetch/lib/index.mjs?:1416:19) at new Promise () at fetch (webpack://ECPNodeAPI/./node_modules/node-fetch/lib/index.mjs?:1414:9) at NodeFetchHttpClient2.eval (webpack://ECPNodeAPI/./node_modules/@azure/core-http/es/src/nodeFetchHttpClient.js?:69:74) 在步骤 (webpack://ECPNodeAPI/./node_modules/@azure/ core-http/node_modules/tslib/tslib.es6.js?:195:19) 在 Object.eval [as next] (webpack://ECPNodeAPI/./node_modules/@azure/core-http/node_modules/tslib/tslib .es6.js?:142:14) 在 eval (webpack://ECPNodeAPI/./node_modules/@azure/core-http/node_modules/tslib/tslib.es6.js?:128:67) 在 new Promise ()在 __awaiter (webpack://ECPNodeAPI/./node_modules/@azure/core-http/node_modules/tslib/tslib.es6.js?:110:10)

node-fetch 问题中提到了该问题：https ://github.com/node-fetch/node-fetch/issues/784 。虽然最新版本声称已修复此问题。但是@azure/storage-blob 使用的是旧版本的 node-fetch。

我尝试过但没有运气的解决方案。

• 使用纱线分辨率能够使用最新版本的 node-fetch 然后捆绑。试过不行。
• 通过将最小化设置为 false 并使用 terser 插件。我尝试了各种组合，但没有像这里这样的运气https://github.com/Azure/ms-rest-nodeauth/issues/83#issuecomment-690927491

还有其他人有任何其他解决方法吗？

我正在使用 Webpack 4、SourceMapDevToolPlugin和terser-webpack-plugin。

问题是我还需要修改缩小的 JS 包——将特定代码注入文件的开头。突变是使用自定义 webpack 插件进行的，该插件接受一个资产源字符串，在它前面加上我的代码并创建一个新的 RawSource。这显然破坏了源映射映射。如果我删除突变部分，那么一切正常。

这里的关键是在缩小之后但在生成源映射之前进行这种突变，而Terser是在我理解的同时进行的。

我使用的当前堆栈可以做到这一点吗？

泰瑟配置：

SourceMapDevToolPlugin 配置：

我有一个依赖项，其中包括对document导入服务工作者的引用。documents 在生产模式下被摇树出局。然而，我实际上需要让我的服务工作者在开发模式下也能完全正常工作（它不仅仅是缓存），所以需要以某种方式在开发构建中摆脱这一点。我所做的任何事情似乎都无法让我的开发和产品构建达到甚至远程相似的大小（产品构建大约​​是大小的 30%）。我对 dev 和 prod 都有以下配置：

并添加new webpack.optimize.ModuleConcatenationPlugin()到plugins，我看到可能（或已经）需要。

据我所知，我对 dev 和 prod 的配置几乎完全相同，但包的大小却完全不同。我怎样才能在 dev 构建和 prod 构建上发生同样的事情？