将一个 javascript 文件与缩小脚本分开的最佳方法是什么？答案

【问题标题】：What is the best way to seperate one javascript file from the minified script?将一个 javascript 文件与缩小脚本分开的最佳方法是什么？
【发布时间】：2018-08-30 11:31:21
【问题描述】：

我不确定这是否是表达我的问题的最佳方式。

我有一个脚本，我想在网站的一个页面上运行。所有 .js 文件都包含/导入到 app.js 文件中，然后将其缩小并包含在每个页面上使用的 layout.html 中。我只想在其中一个页面上使用一个 javascript 文件（我不需要它的页面会在控制台中创建一个错误，所以我不能就这样离开它）。包含它的最佳方法是什么。我仍然可以将它包含在缩小的脚本中，但只包含在该页面上吗？

【问题讨论】：

app.js文件如何在layout.html中包含脚本，为什么不直接在里面使用script标签呢？
您可能会更改代码，使其仅在该页面上运行（例如，如果该页面上存在 ID）

标签： javascript bundling-and-minification

【解决方案1】：

你基本上有三个选择：

在缩小的app.js 中包含脚本，但对其进行修改，以便在运行前检查它是否需要（例如，检查它需要处理的东西是否存在，而不是假设它们在那里）。这样，app.js 在所有页面上都是相同的，可以保存在缓存中，您的构建脚本很简单，等等。
拥有不包含脚本的 app.js，以及仅包含在所需页面上的脚本的单独缩小版本，使用单独的 script 标记。您的构建脚本仍然相当简单，它只向目标页面添加了一个 HTTP 请求。
有两个缩小的 app.js 文件，app.js 和 app-plus.js（或其他）。在所有其他页面上包含app.js，但在目标页面上包含app-plus.js。这会使layout.html 复杂化，因为它必须确定要包含哪个脚本，并且会使您的构建脚本复杂化（非常轻微）。

除非特定于页面的脚本很大，否则选项 #1 可能是您最好的选择，因为它很简单（一旦建立 HTTP 连接，额外的几千字节通常没什么大不了的），但这真的取决于根据你的情况。如果您需要支持带宽相当低的消费者（高速数据包上的移动设备），那可能会反对始终包含脚本。这取决于你。

【讨论】：

感谢您提供详细的答案并列出每个选项的好处！对于第一个选项，如果页面不需要，您能否向我发送有关如何检查并阻止部分缩小脚本运行的正确方向？
@Jessica - 这完全取决于脚本的作用。弄清楚它的作用以及需要检查的内容真的取决于您。

【解决方案2】：

如果您正在构建常规 HTML + CSS + JS 页面，那么您只需将此 javascript 文件（或更多，如果您愿意）添加到一个单独的文件夹，然后在您想要的 HTML 文件中调用它。

EG - 这是你的结构

-index.html
-about.html
-js-for-minify/do.js
-js/not.js
-dist/minified.js
-css

您可以参考 about.html 以获得指向未缩小文件的脚本标记。

<script src="js/not.js">

对于 index.html，您可以引用缩小的文件

<script src ="dist/minified.js">

【讨论】：