如何連接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在構建服務器上使用時證明太麻煩了。 最終創建這個模塊不需要很長時間，現在滿足我的需求。 我將此標記為答案，直到將來出現更好的答案。