Grunt concat JS 并用 HTML 重写链接

Question

我正在使用 Grunt 处理一些任务，我想在构建应用程序时将多个 JS 文件连接到一个文件。

假设我有一些 JS 文件：

js
├── plugin-1.js
├── plugin-2.js
└── plugin-3.js

我想为这个文件构建资产：

js
└── plugins.js

我可以通过运行 Grunt 来做到这一点......但是。

在一些 HTML 模板中，我有指向这些 JS 文件的链接：

<script src="js/plugin-1.js"></script>
<script src="js/plugin-2.js"></script>
<script src="js/plugin-3.js"></script>

我希望 Grunt 将其重写为：

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

这有什么可能吗？

Answer 1

我也在寻找这个问题的解决方案，我找到了一个：使用 grunt 模块gunt-use-ref。

尽管我最终决定使用静态方法（一个包含所有样式或 js 的缩小文件）更好地满足我的需求，但它可能会对您有所帮助。为什么？因为需要为每个页面加载单独的合并和缩小文件，而包含所有内容的单个文件保留在浏览器缓存中（例如检查H5BP template's .htaccess）并且只需要下载一次。因此，请确定您使用的用例：如果您希望访问者只访问一个页面，请使用单独的方法以快速加载首页，如果您希望他们访问不同的页面，请使用通用解决方案以获得快速体验访问许多页面时。

来自文档：