避免在 ParcelJS 上的 HTML 文件中重命名 JS 变量

Question

我使用 ParcelJS 作为模块捆绑器，由于某些原因，我在 HTML 中使用 JS 变量，这些变量稍后将由 JS 代码读取。

在我的 HTML 中：

<script>
  var myVar = {
    key1: 'value1',
    key2: 'value2'
  };
</script>

在我的JS中：

console.log(window.myVar.key1);

当我使用构建静态站点时parcel build，HTML 中的 JS 变量被重命名，因此我无法再从 JS 文件中读取它：

<script>var a = { key1: 'value1', key2: 'value2' };</script>

根据Parcel 文档，看起来重命名（重命名）是由htmlnano完成的，它在幕后使用Terser进行 JS 缩小。

我尝试使用.htmlnanorc包含以下内容的文件：

{
  "minifyJs": {
    "mangle": false
  },
  "removeComments": false
}

我添加该removeComments选项只是为了确保.htmlnanorc文件正在被处理。HTML 注释被保留，事实如此。

但是 JS 变量不断被重命名，尽管我已经根据他们的文档尝试了几种 Terser 配置。所以看起来 htmlnano 忽略了该minifyJs键下的任何配置。

我做错了什么吗？或者可能是某种 ParcelJS 或 htmlnano 错误？

Answer 1

将变量名称更改为

<script>
  window.myVar = {
    key1: 'value1',
    key2: 'value2'
  };
</script>

无法使用来更改此行为parcel.js，因此您必须采取解决方法。