Ich verwende jquery in meiner Webanwendung und muss mehr jquery-Skriptdateien auf eine einzelne Seite laden.
Google schlug vor, alle JQuery-Skriptdateien in einer einzigen Datei zu kombinieren.
Wie kann ich das machen?
Ich verwende jquery in meiner Webanwendung und muss mehr jquery-Skriptdateien auf eine einzelne Seite laden.
Google schlug vor, alle JQuery-Skriptdateien in einer einzigen Datei zu kombinieren.
Wie kann ich das machen?
Antworten:
Unter Linux können Sie das einfache Shell-Skript https://github.com/dfsq/compressJS.sh verwenden , um mehrere Javascript-Dateien zu einer einzigen zu kombinieren. Es nutzt den Onlinedienst Closure Compiler, sodass das resultierende Skript auch effektiv komprimiert wird.
$ ./compressJS.sh some-script.js another-sctipt.js onemore.js
Probieren Sie den Google Closure Compiler aus:
http://code.google.com/closure/compiler/docs/gettingstarted_ui.html
Kombinieren Sie einfach die Textdateien und verwenden Sie dann so etwas wie den YUI-Kompressor .
Dateien können einfach mit dem Befehl kombiniert werden cat *.js > main.js
und main.js kann dann mit dem YUI-Kompressor ausgeführt werden java -jar yuicompressor-x.y.z.jar -o main.min.js main.js
.
Update August 2014
Ich bin jetzt auf die Verwendung von Gulp für die Verkettung und Komprimierung von Javascript umgestiegen, da Sie mit verschiedenen Plugins und einigen minimalen Konfigurationen beispielsweise Abhängigkeiten einrichten, Coffeescript kompilieren usw. sowie Ihre JS komprimieren können.
Sie können dies über tun
include
aller und geben Sie sie in ein <script>
Tag ausinclude
dh nicht <script src = "...."> mit mehreren Dateien verknüpfen, sondern sie einfach in ein Skriptelement aufnehmen. Idealerweise sollte eine CDN zusammen mit dem richtigen Caching verwendet werden.
Ich habe es normalerweise auf einem 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)
Dann rennst du:
make compile
Ich hoffe, es hilft.
Ich verwende dieses Shell-Skript unter Linux https://github.com/eloone/mergejs .
Im Vergleich zu den oben genannten Skripten hat es den Vorteil, dass es sehr einfach zu verwenden ist. Ein großes Plus ist, dass Sie die JS-Dateien, die Sie zusammenführen möchten, in einer Eingabetextdatei und nicht in der Befehlszeile auflisten können, sodass Ihre Liste wiederverwendbar ist Sie müssen es nicht jedes Mal eingeben, wenn Sie Ihre Dateien zusammenführen möchten. Dies ist sehr praktisch, da Sie diesen Schritt jedes Mal wiederholen, wenn Sie in die Produktion gehen möchten. Sie können auch Dateien kommentieren, die Sie nicht in der Liste zusammenführen möchten. Die Befehlszeile, die Sie höchstwahrscheinlich eingeben würden, lautet:
$ mergejs js_files_list.txt output.js
Und wenn Sie auch die resultierende zusammengeführte Datei komprimieren möchten:
$ mergejs -c js_files_list.txt output.js
Dies wird output-min.js
vom Google Closure Compiler minimiert. Oder :
$ mergejs -c js_files_list.txt output.js output.minified.js
Wenn Sie einen bestimmten Namen für Ihre minimierte Datei mit dem Namen möchten output.minified.js
Ich finde es sehr hilfreich für eine einfache Website.
Die Gruppierung von Skripten ist kontraproduktiv. Sie sollten sie parallel über http://yepnopejs.com/ oder http://headjs.com laden
Kopieren Sie dieses Skript in den Editor und speichern Sie es als .vbs-Datei. Ziehen Sie .js-Dateien in dieses Skript und legen Sie sie dort ab.
ps. Dies funktioniert nur unter 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
Sie können den Closure-Compiler wie von orangutancloud vorgeschlagen verwenden. Es ist erwähnenswert, dass Sie nicht wirklich benötigen zu kompilieren / minify die JavaScript, sollte es möglich sein, einfach die JavaScript - Textdateien in eine einzige Textdatei verketten. Verbinden Sie sie einfach in der Reihenfolge, in der sie normalerweise auf der Seite enthalten sind.
Sie können KjsCompiler verwenden: https://github.com/knyga/kjscompiler Cooles Abhängigkeitsmanagement
Sie können ein Skript verwenden, das ich erstellt habe. Sie benötigen JRuby, um dies auszuführen. https://bitbucket.org/ardee_aram/jscombiner (JSCombiner).
Das Besondere daran ist, dass es Dateiänderungen im Javascript überwacht und diese automatisch mit dem Skript Ihrer Wahl kombiniert. Sie müssen Ihr Javascript also nicht jedes Mal manuell "erstellen", wenn Sie es testen. Hoffe es hilft dir weiter, ich benutze das gerade.
Dies mag ein bisschen mühsam sein, aber Sie können mein Open-Source-Wiki-Projekt von Codeplex herunterladen:
http://shuttlewiki.codeplex.com
Es enthält ein CompressJavascript-Projekt (und CompressCSS), das das Projekt http://yuicompressor.codeplex.com/ verwendet .
Der Code sollte selbsterklärend sein, aber es macht das Kombinieren und Komprimieren der Dateien ein bisschen einfacher --- für mich jedenfalls :)
Das ShuttleWiki-Projekt zeigt, wie es im Post-Build-Ereignis verwendet wird.