如何连接javascript文件并替换HTML中的引用？

Question

作为TeamCity上构建/ CI过程的一部分，我想指定一组在我的HTML中引用的JavaScript文件，并将它们合并为一个。

换句话说，这就是我想要实现的目标。

之前：

<script src="1.js" />
<script src="2.js" />

后

<script src="combined.js" />

我正在寻找一个命令行工具来将1.js和2.js连接成combined.js。 然后，命令行工具（或可能是相同的工具）将HTML文件中的引用替换为此新文件。 请告诉我如何才能做到这一点。

到目前为止我尝试过的：

我一直在寻找看起来不错的grunt-usemin ，但是需要构建服务器在每个构建上执行npm install以获取依赖项，然后运行它。 这需要太长时间并且不是一个好的解决方案，因为我们非常频繁地构建+部署。

我知道我也可以将我的node_modules文件夹添加到git中，但这也是不可取的。 如果grunt可以运行全局安装这些模块会很好，但它不是那种笨拙的方式（除非我弄错了，grunt想要在本地安装所有东西）。

有人还建议在开发者机器上运行grunt。 同样，由于我们有瞬态虚拟机而不受欢迎，这会破坏开发流程。

如果我可以在没有咕噜声的情况下在本地运行grunt-usemin会很好！

Answer 1

要合并文件，您只需使用cat

cat 1.js 2.js > combined.js

要替换大块的html，你可以使用sed

sed -i "s/<script src=\"1.js\">\n<script src=\"2.js\">/<script src=\"combined.js\">/g" *.html

这是一个相当普遍的解决方案，但对我来说似乎有点笨拙。 如果你在节点中渲染这个html，你可以考虑在javascript中替换它，如果组合文件存在的话。

if (fs.existsSync('combined.js')) {
    res.end(html_contents.replace('<script src="1.js"/>\n<script src="2.js"/>','<script src="combined.js">'));
} else {
    res.end(html_contents);
}

为了获得更好的性能，您当然可以使用fs.exists的异步版本

Answer 2

我最终创建了自己的： https ： //npmjs.org/package/hashcat

npm install -g hashcat

@ gustavohenke的建议很接近，但最终h5bp在构建服务器上使用时证明太麻烦了。 最终创建这个模块不需要很长时间，现在满足我的需求。 我将此标记为答案，直到将来出现更好的答案。