1

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

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

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

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

const htmlmin = require('gulp-html-minifier-terser'); 

function myTask(){
  let options = {
    ...
    minifyJS: {
        nameCache: {},
    },
  };
  return gulp.src(path1))
  .pipe(htmlmin(options))
  .pipe(gulp.dest(path2)))
  .on('finish', () => {
    fs.writeFileSync(cacheFileName, JSON.stringify(options.minifyJS.nameCache), "utf8");
  });
}

问题是输出只有：

{"vars":{"props":{}}}

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

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

更新

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

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

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

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

  let options = {
    ...
    minifyJS: {
        nameCache: {},
        mangle: {
            properties: false,
        }
    },
  };

这会产生如下文件：

{"vars":{"props":{}},"props":{"props":{"$serverSide":"t","$processing":"i", 
 "$ajax":"u","$projectId":"l", ... }}}

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

4

0 回答 0