HtmlWebpackPlugin未缩小脚本标记

我正在使用以下设置：

新的HtmlWebpackPlugin({
模板：“src/index.ejs”，
缩小：isDevelopment？错误：{
区分大小写：错误，
removeComments：对，
拼贴空白：对，
删除和声明：是的，
useShortDoctype:false，
RemovemptyAttributes：没错，
removeStyleLinkTypeAttributes:true，
removeScriptTypeAttributes:true，
keepClosingSlash:false，
真的，
没错，
minifyURLs：是的，
Sortat贡品：没错，
sortClassName:true，
},
}),

我相信它被转发到了，但它并没有压缩我的

标签

HTML和CSS是压缩的，但不是我的JS

如何启用脚本压缩

---

不完全正确事实上，我不确定它在做什么。这：

//TODO:压缩这个或移动这个或其他东西
if（导航器中的“serviceWorker”）{
window.addEventListener（'load'，（）=>{
// https://github.com/GoogleChrome/workbox/issues/1790
navigator.serviceWorker.register（'/service worker.js'）。然后（registration=>{
控制台信息（“软件注册：”，注册）；
}).catch（注册错误=>{
console.error（'SW注册失败：'，registrationError）；
});
});
}

“压缩”到以下内容：

//TODO:压缩或移动此内容或其他内容
if（导航器中的“serviceWorker”）{
window.addEventListener（'load'，（）=>{
// https://github.com/GoogleChrome/workbox/issues/1790
navigator.serviceWorker.register（'/service worker.js'）。然后（registration=>{
控制台信息（“软件注册：”，注册）；
}).catch（注册错误=>{
console.error（'SW注册失败：'，registrationError）；
});
});
}

i、 例如，它删除了一点空白，甚至可能只是从

collapseWhitespace

选项中删除。然而，这：

if（导航器中的（'serviceWorker'）navigator.serviceWorker.register（'/service worker.js'））

将压缩到：

导航器中的“serviceWorker”&&navigator.serviceWorker.register（“/service worker.js”）中

---

所以它在做些什么，但我不知道是什么。它不像我在那里有评论吗？

拼贴空格：true只对html有效，而对JS无效。看看这里

我测试了你的案例，只是把minifyJS改成了下面的一个。所有内容都被很好地压缩了，甚至是html中的脚本

new HtmlWebpackPlugin({
  template: 'src/index.ejs',
  minify: isDevelopment ? false : {
    caseSensitive: false,
    removeComments: true,
    collapseWhitespace: true,
    removeRedundantAttributes: true,
    useShortDoctype: false,
    removeEmptyAttributes: true,
    removeStyleLinkTypeAttributes: true,
    removeScriptTypeAttributes: true,
    keepClosingSlash: false,
    minifyJS: { compress: { conditionals: false }}
    minifyCSS: true,
    minifyURLs: true,
    sortAttributes: true,
    sortClassName: true,
  },
}),

但是如果

minifyJS:true

则代码会像您一样中断 问题是

minifyJS:true

对脚本的干扰太大。看看有多少选择，它只是压缩，疯狂：）

我自己从来不压缩html脚本，原因很简单，它有太多问题。我总是设置

minify:true

，默认情况下，它会提供：

{
   collapseWhitespace: true,
   removeComments: true,
   removeRedundantAttributes: true,
   removeScriptTypeAttributes: true,
   removeStyleLinkTypeAttributes: true,
   useShortDoctype: true
}

---

collapseWhitespace:true

仅对html有效，对JS无效。看看这里

我测试了你的案例，只是把minifyJS改成了下面的一个。所有内容都被很好地压缩了，甚至是html中的脚本

new HtmlWebpackPlugin({
  template: 'src/index.ejs',
  minify: isDevelopment ? false : {
    caseSensitive: false,
    removeComments: true,
    collapseWhitespace: true,
    removeRedundantAttributes: true,
    useShortDoctype: false,
    removeEmptyAttributes: true,
    removeStyleLinkTypeAttributes: true,
    removeScriptTypeAttributes: true,
    keepClosingSlash: false,
    minifyJS: { compress: { conditionals: false }}
    minifyCSS: true,
    minifyURLs: true,
    sortAttributes: true,
    sortClassName: true,
  },
}),

但是如果

minifyJS:true

则代码会像您一样中断 问题是

minifyJS:true

对脚本的干扰太大。看看有多少选择，它只是压缩，疯狂：）

我自己从来不压缩html脚本，原因很简单，它有太多问题。我总是设置

minify:true

，默认情况下，它会提供：

{
   collapseWhitespace: true,
   removeComments: true,
   removeRedundantAttributes: true,
   removeScriptTypeAttributes: true,
   removeStyleLinkTypeAttributes: true,
   useShortDoctype: true
}

---

我很确定某处有一只虫子；如果脚本包含箭头函数，它将不会压缩脚本（我认为这是决定性因素——我一取出它们，它就缩小了）。我尝试过使用

parse

选项，您可以将这些选项传递给它，但没有任何帮助

事实证明，

minifyJS

也接受一个回调函数，并且以这种方式通过Terser显式运行代码效果很好：

新的HtmlWebpackPlugin({
模板：“src/index.ejs”，
淋浴者：发展，
缩小：isDevelopment？错误：{
区分大小写：错误，
removeComments：对，
拼贴空白：对，
删除和声明：是的，
useShortDoctype:false，
RemovemptyAttributes：没错，
removeStyleLinkTypeAttributes:true，
removeScriptTypeAttributes:true，
keepClosingSlash:false，
minifyJS:code=>Terser.minify（code.code），//我很确定某个地方有一个bug；如果脚本包含箭头函数，它将不会压缩脚本（我认为这是决定性因素——我一取出它们，它就缩小了）。我试着使用
parse
选项，您可以传递到该选项，但这没有帮助

事实证明，
minifyJS
也接受一个回调函数，并且以这种方式通过Terser显式运行代码效果很好：

新的HtmlWebpackPlugin({
模板：“src/index.ejs”，
淋浴者：发展，
缩小：isDevelopment？错误：{
区分大小写：错误，
removeComments：对，
拼贴空白：对，
删除和声明：是的，
useShortDoctype:false，
RemovemptyAttributes：没错，
removeStyleLinkTypeAttributes:true，
removeScriptTypeAttributes:true，
keepClosingSlash:false，
minifyJS:code=>Terser.minify（code.code，//HtmlWebpackPlugin使用另一个插件。如果您使用
minifyJS:true
，那么js压缩方法太激进：）更改为：
minifyJS:{compre