Объединение нескольких файлов JavaScript в один JS файл

Я использую jquery в своем веб-приложении, и мне нужно загрузить больше jquery script файлов на одну страницу.

Google предложил объединить все файлы jquery script в один файл.

Как я могу это сделать?

Ответ 1

В linux вы можете использовать простую оболочку script https://github.com/dfsq/compressJS.sh, чтобы объединить несколько файлов javascript в один. Он использует онлайн-службу Closure Compiler, поэтому итоговый script также эффективно сжимается.

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

Ответ 2

Просто соедините текстовые файлы, а затем используйте что-то вроде YUI Compressor.

Файлы можно легко комбинировать с помощью команды cat *.js > main.js, а main.js можно запустить через компрессор YUI, используя java -jar yuicompressor-x.y.z.jar -o main.min.js main.js.

Обновление Aug 2014

Теперь я перешел на использование Gulp для конкатенации и сжатия javascript, так как с различными плагинами и некоторой минимальной конфигурацией вы можете делать такие вещи, как настроить зависимости, компилировать coffeescript и т.д., а также сжимать ваш JS.

Ответ 4

Вы можете сделать это через

  • а. Вручную: копировать все файлы Javascript в один, запустить компрессор на нем (необязательно, но рекомендуется) и загрузить на сервер и ссылку на этот файл.
  • б. Использовать PHP: Просто создайте массив всех JS файлов и include их всех и выведите в тег <script>

Ответ 5

Я использую эту оболочку script для Linux https://github.com/eloone/mergejs.

По сравнению с вышеприведенными сценариями он имеет преимущества очень простой в использовании, и большой плюс заключается в том, что вы можете перечислить файлы js, которые хотите объединить во входном текстовом файле, а не в командной строке, поэтому ваш список многократно используется, и вам не нужно вводить его каждый раз, когда вы хотите объединить файлы. Это очень удобно, так как вы будете повторять этот шаг каждый раз, когда хотите вступить в производство. Вы также можете комментировать файлы, которые вы не хотите объединять в списке. В командной строке вы, скорее всего, введите:

$ mergejs js_files_list.txt output.js

И если вы хотите сжать полученный объединенный файл:

$ mergejs -c js_files_list.txt output.js

Это создаст output-min.js, сокращенный компилятором Google закрытия. Или:

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

Если вы хотите указать определенное имя для вашего мини файла с именем output.minified.js

Я считаю, что это действительно полезно для простого веб-сайта.

Ответ 6

Script группировка контрпродуктивна, вы должны загружать их параллельно, используя что-то вроде http://yepnopejs.com/ или http://headjs.com

Ответ 7

Я обычно использую его на 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

Надеюсь, это поможет.

Ответ 8

Вы можете использовать компилятор Closure, как предлагает orangutancloud. Стоит отметить, что на самом деле вам не нужно компилировать/минимизировать JavaScript, поэтому нужно просто объединить текстовые файлы JavaScript в один текстовый файл. Просто присоединитесь к ним в том порядке, в котором они обычно включены в страницу.

Ответ 9

Скопируйте этот script в блокнот и сохраните файл .vbs. Drag & Drop.js на этом script.

пс. Это будет работать только на окнах.

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

Ответ 10

Если вы используете PHP, я рекомендую Minify, потому что он сочетает и минимизирует "на лету" как для CSS, так и для JS. После того, как вы настроили его, просто работайте нормально, и он заботится обо всем.

Ответ 12

Вы можете использовать script, который я сделал. Для этого вам нужен JRuby. https://bitbucket.org/ardee_aram/jscombiner (JSCombiner).

Что отличает это, так это то, что он отслеживает изменения файла в javascript и автоматически объединяет его с script по вашему выбору. Поэтому нет необходимости вручную "строить" ваш javascript каждый раз, когда вы его тестируете. Надеюсь, это поможет вам, я в настоящее время использую это.

Ответ 13

Это может быть немного усилий, но вы можете загрузить мой проект wiki с открытым исходным кодом из codeplex:

http://shuttlewiki.codeplex.com

Он содержит проект CompressJavascript (и CompressCSS), который использует проект http://yuicompressor.codeplex.com/.

Код должен быть понятным, но он позволяет комбинировать и сжимать файлы немного simnpler --- для меня в любом случае:)

Проект ShuttleWiki показывает, как использовать его в событии после сборки.