Combina più file JavaScript in un unico file JS [chiuso]

Sto usando jquery nella mia applicazione web e ho bisogno di caricare più file di script jquery in una singola pagina.

Google ha suggerito di combinare tutti i file di script jquery in un unico file.

Come posso fare questo?

Su Linux puoi usare un semplice script di shell https://github.com/dfsq/compressJS.sh per combinare più file javascript in uno solo. Utilizza il servizio online Closure Compiler in modo che anche lo script risultante venga compresso in modo efficace.

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

Prova il compilatore di chiusura di Google:

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

Basta combinare i file di testo e quindi utilizzare qualcosa come il compressore YUI .

I file possono essere facilmente combinati utilizzando il comando cat *.js > main.jse main.js può quindi essere eseguito tramite il compressore YUI utilizzando java -jar yuicompressor-x.y.z.jar -o main.min.js main.js.

Aggiornamento agosto 2014

Ora sono passato all'uso di Gulp per la concatenazione e la compressione javascript poiché con vari plugin e alcune configurazioni minime puoi fare cose come impostare le dipendenze, compilare coffeescript ecc. Oltre a comprimere il tuo JS.

Puoi farlo tramite

• un. Manualmente: copia tutti i file Javascript in uno, esegui un compressore su di esso ( opzionale ma consigliato ) e carica sul server e collega a quel file.
• b. Usa PHP: crea semplicemente un array di tutti i file JS e includetutti e l'output in un <script>tag

Di solito ce l'ho su un 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)

Quindi corri:

make compile

Spero possa essere d'aiuto.

Uso questo script di shell su Linux https://github.com/eloone/mergejs .

Rispetto agli script precedenti ha il vantaggio di essere molto semplice da usare e un grande vantaggio è che puoi elencare i file js che vuoi unire in un file di testo di input e non nella riga di comando, quindi il tuo elenco è riutilizzabile e non è necessario digitarlo ogni volta che si desidera unire i file. È molto utile poiché ripeterai questo passaggio ogni volta che desideri avviare la produzione. Puoi anche commentare i file che non desideri unire nell'elenco. La riga di comando che molto probabilmente digiteresti è:

$ mergejs js_files_list.txt output.js

E se vuoi comprimere anche il file risultante unito:

$ mergejs -c js_files_list.txt output.js

Questo creerà output-min.jsminimizzato dal compilatore di chiusura di Google. O :

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

Se desideri un nome specifico per il tuo file minimizzato denominato output.minified.js

Lo trovo davvero utile per un semplice sito web.

Il raggruppamento degli script è controproducente, dovresti caricarli in parallelo usando qualcosa come http://yepnopejs.com/ o http://headjs.com

Copia questo script nel blocco note e salva come file .vbs. Trascina e rilascia i file .js su questo script.

ps. Funzionerà solo su 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

Puoi usare il compilatore Closure come suggerisce orangutancloud. Vale la pena sottolineare che in realtà non è necessario compilare / minimizzare JavaScript, dovrebbe essere possibile semplicemente concatenare i file di testo JavaScript in un singolo file di testo. Unisciti a loro nell'ordine in cui sono normalmente inclusi nella pagina.

Se stai utilizzando PHP, ti consiglio Minify perché combina e minimizza al volo sia CSS che JS. Una volta configurato, funziona normalmente e si occupa di tutto.

Puoi usare KjsCompiler: https://github.com/knyga/kjscompiler Cool dependency managment

Puoi usare uno script che ho realizzato. Hai bisogno di JRuby per eseguirlo però. https://bitbucket.org/ardee_aram/jscombiner (JSCombiner).

Ciò che lo distingue è che guarda le modifiche ai file in javascript e le combina automaticamente allo script di tua scelta. Quindi non c'è bisogno di "costruire" manualmente il tuo javascript ogni volta che lo provi. Spero che ti sia d'aiuto, attualmente lo sto usando.

Potrebbe essere un po 'faticoso, ma puoi scaricare il mio progetto wiki open source da codeplex:

http://shuttlewiki.codeplex.com

Contiene un progetto CompressJavascript (e CompressCSS) che utilizza il progetto http://yuicompressor.codeplex.com/ .

Il codice dovrebbe essere autoesplicativo ma rende la combinazione e la compressione dei file un po 'più semplice --- per me comunque :)

Il progetto ShuttleWiki mostra come usarlo nell'evento post-build.