从缩小的脚本中分离一个javascript文件的最佳方法是什么？

Question

我不确定这是否是表达我的问题的最好方法。

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

Answer 1

您基本上有三个选择：

1. 将脚本包含在缩小的app.js ，但对其进行修改，以便在运行之前检查是否需要它（例如，检查是否需要执行其工作，而不是假设它们在那里）。 这样一来， app.js在所有页面上都是相同的，可以保存在缓存中，构建脚本很简单，等等。

2. 拥有不包含脚本的app.js ，以及使用单独的script标签仅包含在所需页面上的单独的缩小版script 。 您的构建脚本仍然非常简单，并且只向目标页面添加了一个HTTP请求。

3. 有两个缩小的app.js文件，即app.js和app-plus.js （或其他）。 在所有其他页面上包括app.js ，但在目标页面上包括app-plus.js 。 这会使layout.html变得复杂，因为它必须确定要包含的脚本，并使构建脚本（非常轻微）复杂。

除非特定于页面的脚本非常庞大，否则选项1可能会是您的最佳选择，因为它很简单（一旦建立HTTP连接，通常就不会增加几千字节的麻烦了），但这确实取决于您的情况。 如果您需要支持带宽相当低的使用者（使用高速率数据包的移动设备），则可能会反对总是包含脚本。 由你决定。

Answer 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">