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

时间:2018-08-30 11:31:21

标签: javascript bundling-and-minification

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

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

2 个答案:

答案 0 :(得分:1)

您基本上有三个选择:

  1. 将脚本包含在缩小的app.js中,但对其进行修改,以便它检查是否需要(例如,检查是否存在需要处理的内容,而不是假设它们在那里)。运行。这样,app.js在所有页面上都相同,可以保存在缓存中,构建脚本很简单,等等。

  2. 具有app.js(不包括脚本),以及使用单独的script标签(仅包含在所需页面上)的单独的压缩版本。您的构建脚本仍然相当简单,并且仅向目标页面添加了一个HTTP请求。

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

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

答案 1 :(得分:0)

如果您要构建常规的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">