將多個JavaScript文件合併成一個JS文件

我在我的web應用程序中使用jquery，我需要將更多jQuery腳本文件加載到單個頁面中。將多個JavaScript文件合併成一個JS文件

谷歌建議我把所有的jQuery腳本文件合併成一個文件。

我該怎麼做？

2011-04-01 Chandrasekhar

在Linux上，你可以使用簡單的shell腳本https://github.com/dfsq/compressJS.sh多個javascript文件合併成單一的一個加載它們並行。它使用Closure Compiler在線服務，因此生成的腳本也被有效地壓縮。

$ ./compressJS.sh some-script.js another-sctipt.js onemore.js

來源

2011-09-16 19:42:55 dfsq

完全相同的問題，這可以使用handlebar？ – 2013-05-17 00:45:47

更好地使用像Grunt，Gulp和其他類似的工具自動執行任務管理器。使用Grunt我編譯我的少，打字稿，把手到一個生成的文件夾，然後我複製js/css文件到生成的文件夾，最後我還將一個js文件壓縮成一個js文件並放入一個css文件所有的.css文件。我有一位觀察員在文件更改時重新運行該配置，以便我可以保存文件並刷新瀏覽器，並在1-3秒內應用所有更改。 – Vadorequest 2015-05-09 10:25:54

試用谷歌關閉編譯：

http://code.google.com/closure/compiler/docs/gettingstarted_ui.html

來源

2011-04-01 10:19:07

可以使用封閉編譯爲orangutancloud建議。值得指出的是，您實際上並不需要來編譯/縮小JavaScript，應該可以簡單地將JavaScript文本文件連接成單個文本文件。只需按照它們通常包含在頁面中的順序加入它們即可。

來源

2011-04-01 10:20:41

是的，好點。如果你或者插件作者沒有跟上好的語法，或者你正在嘗試調試，那麼閉包編譯器會很棘手。但是，如果您以最基本的模式使用它，它可能會有所幫助。我個人非常喜歡Dojo，並使用他們的dojo項目構建系統，這確實有助於將所有內容保存在一個文件中。但它僅用於部署，而不用於開發。 – 2011-04-01 10:27:42

您可以通過

一個做到這一點。手動：將所有Javascript文件複製到一個，運行一個壓縮器（可選，但建議）並上傳到服務器並鏈接到該文件。
b。使用PHP：只需創建所有的JS文件的數組和include他們都輸出到<script>標籤

來源

2011-04-01 10:24:09

不推薦使用選項B，因爲它會導致您的瀏覽器針對所有小型個人.js文件（較慢）發出很多請求，而不是僅僅請求一個更大的.js文件（更快）。 – Mikepote 2013-06-27 08:59:58

@Mikepote，是的......因此我使用了「include」這個詞，即不要將

剛剛合併文本文件，然後使用類似YUI Compressor。

使用命令cat *.js > main.js可以輕鬆地組合文件，然後可以使用java -jar yuicompressor-x.y.z.jar -o main.min.js main.js通過YUI壓縮器運行main.js。

更新2014年8月

我現在已經遷移到使用Gulp javascript的級聯和壓縮與各種插件和一些最低配置，你可以做這樣的事情建立依賴性，編譯CoffeeScript的等，以及壓縮你的JS。

來源

2011-04-01 10:24:46 Prydie

這可能有點功夫，但你可以從CodePlex上下載我的開源項目維基：

http://shuttlewiki.codeplex.com

它包含CompressJavascript項目（和CompressCSS），採用http://yuicompressor.codeplex.com/項目。

的代碼應該是不言自明，但它使組合和壓縮文件有點simnpler ---我反正:)

的ShuttleWiki項目展示瞭如何在生成後事件中使用它。

來源

2011-04-01 10:28:11

腳本分組是適得其反，你應該使用類似http://yepnopejs.com/或http://headjs.com

來源

2011-04-01 10:30:23 Capsule

有合理的JavaScript文件有正當理由。首先，很可能請求20個2kb文件比請求一個40kb文件需要更長的時間。 – 2015-01-21 23:59:02

每千次發生多少次？ – Capsule 2015-01-23 04:43:54

比你想象的更頻繁。請看一下即使在stackoverflow的源代碼：「...選項B不推薦，因爲它會導致您的瀏覽器對所有的小個人.js文件（慢），而不是一個請求更大的.js文件（更快）「。 – 2015-01-23 22:08:50

如果你正在運行PHP，我建議Minify，因爲它在飛行兩個CSS和JS聯合收割機和minifies。一旦你完成了配置，就像平常一樣工作，它會處理所有事情。

來源

2012-11-12 23:03:09 technoTarek

將此腳本複製到記事本並另存爲.vbs文件。拖動&在此腳本上拖放.js文件。

ps。這隻適用於Windows。

set objArgs = Wscript.Arguments 
set objFso = CreateObject("Scripting.FileSystemObject") 
content = "" 

'Iterate through all the arguments passed 
for i = 0 to objArgs.count 
    on error resume next 
    'Try and treat the argument like a folder 
    Set folder = objFso.GetFolder(objArgs(i)) 
    'If we get an error, we know it is a file 
    if err.number <> 0 then 
     'This is not a folder, treat as file 
     content = content & ReadFile(objArgs(i)) 
    else 
     'No error? This is a folder, process accordingly 
     for each file in folder.Files 
      content = content & ReadFile(file.path) 
     next 
    end if 
    on error goto 0 
next 

'Get system Temp folder path 
set tempFolderPath = objFso.GetSpecialFolder(2) 
'Generate a random filename to use for a temporary file 
strTempFileName = objFso.GetTempName 
'Create temporary file in Temp folder 
set objTempFile = tempFolderPath.CreateTextFile(strTempFileName) 
'Write content from JavaScript files to temporary file 
objTempFile.WriteLine(content) 
objTempFile.Close 

'Open temporary file in Notepad 
set objShell = CreateObject("WScript.Shell") 
objShell.Run("Notepad.exe " & tempFolderPath & "\" & strTempFileName) 


function ReadFile(strFilePath) 
    'If file path ends with ".js", we know it is JavaScript file 
    if Right(strFilePath, 3) = ".js" then  
     set objFile = objFso.OpenTextFile(strFilePath, 1, false) 
     'Read entire contents of a JavaScript file and returns it as a string 
     ReadFile = objFile.ReadAll & vbNewLine 
     objFile.Close 
    else 
     'Return empty string 
     ReadFile = "" 
    end if 
end function

來源

2013-01-15 15:07:19

我通常有它在Makefile：

# All .js compiled into a single one. 
compiled=./path/of/js/main.js 

compile: 
    @find ./path/of/js -type f -name "*.js" | xargs cat > $(compiled)

然後運行：

make compile

我希望它能幫助。

來源

2013-02-07 04:25:33

您可以使用我製作的腳本。你需要JRuby來運行這個。 https://bitbucket.org/ardee_aram/jscombiner（JSCombiner）。

這與衆不同的地方在於它會監視JavaScript中的文件更改，並將其自動結合到您選擇的腳本中。因此，每次測試時都不需要手動「構建」您的JavaScript。希望它可以幫助你，我目前正在使用這個。

來源

2013-04-11 16:03:46

我在Linux上使用這個shell腳本https://github.com/eloone/mergejs。

與上面的腳本相比，它具有使用非常簡單的優點，另外一個好處是您可以列出要合併到輸入文本文件而不是命令行中的js文件，因此您的列表是可重複使用的，您不必在每次要合併文件時都鍵入它。這非常方便，因爲每次你想要投入生產時你都會重複這一步驟。您也可以評論不想在列表中合併的文件。在命令行中，你最有可能的類型是：

$ mergejs js_files_list.txt output.js

如果你也想壓縮合並後的文件：

$ mergejs -c js_files_list.txt output.js

這將創建output-min.js由谷歌的關閉編譯器精縮。或者：

$ mergejs -c js_files_list.txt output.js output.minified.js

如果你想爲一個名爲output.minified.js

你的精縮文件，具體名字我找到一個簡單的網站是真的很有幫助。

來源

2013-04-22 22:31:16 eloone

您可以使用KjsCompiler：https://github.com/knyga/kjscompiler 酷依賴同治

來源

2014-01-08 15:05:06

我一直在尋找這樣的工具幾個小時，但最後這工作正是我想象它應該工作。簡單而直接。 – 2014-04-29 03:55:34

相關問題

將多個JavaScript文件合併成一個JS文件

回答

相關問題