여러 JavaScript 파일을 하나의 JS 파일로 결합 [closed]

웹 응용 프로그램에서 jquery를 사용하고 있으며 더 많은 jquery 스크립트 파일을 단일 페이지에로드해야합니다.

Google은 모든 jquery 스크립트 파일을 단일 파일로 결합 할 것을 제안했습니다.

어떻게 할 수 있습니까?

Linux에서는 간단한 셸 스크립트 https://github.com/dfsq/compressJS.sh 를 사용하여 여러 javascript 파일을 단일 파일로 결합 할 수 있습니다 . Closure Compiler 온라인 서비스를 사용하므로 결과 스크립트도 효과적으로 압축됩니다.

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

Google 클로저 컴파일러를 사용해보십시오.

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

텍스트 파일을 결합한 다음 YUI Compressor 와 같은 것을 사용하십시오 .

명령을 사용하여 파일을 쉽게 결합 할 수 있으며 cat *.js > main.js.js를 사용하여 YUI 압축기를 통해 main.js를 실행할 수 있습니다 java -jar yuicompressor-x.y.z.jar -o main.min.js main.js.

2014 년 8 월 업데이트

이제 다양한 플러그인과 최소한의 구성으로 자바 스크립트 연결 및 압축을 위해 Gulp 를 사용하여 마이그레이션 했습니다. 종속성 설정, coffeescript 컴파일 등의 작업은 물론 JS 압축과 같은 작업을 수행 할 수 있습니다.

다음을 통해이 작업을 수행 할 수 있습니다.

• ㅏ. 수동 : 모든 자바 스크립트 파일을 하나로 복사하고 압축기를 실행하고 ( 선택 사항이지만 권장 됨 ) 서버에 업로드하고 해당 파일에 연결합니다.
• 비. PHP 사용 : 모든 JS 파일과 include모든 파일의 배열을 만들고 <script>태그 로 출력

나는 보통 그것을 가지고 있습니다 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

도움이되기를 바랍니다.

Linux https://github.com/eloone/mergejs 에서이 셸 스크립트를 사용합니다 .

위의 스크립트와 비교할 때 사용하기가 매우 간단하다는 장점이 있으며, 큰 장점은 병합하려는 js 파일을 명령 줄이 아닌 입력 텍스트 파일에 나열 할 수 있으므로 목록을 재사용 할 수 있고 파일을 병합 할 때마다 입력 할 필요가 없습니다. 프로덕션에 적용 할 때마다이 단계를 반복하기 때문에 매우 편리합니다. 목록에서 병합하지 않을 파일에 주석을 달 수도 있습니다. 입력 할 가능성이 가장 높은 명령 줄은 다음과 같습니다.

$ mergejs js_files_list.txt output.js

그리고 병합 된 결과 파일도 압축하려면 다음을 수행하십시오.

$ mergejs -c js_files_list.txt output.js

이것은 output-min.jsGoogle의 클로저 컴파일러에 의해 축소됩니다. 또는 :

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

축소 된 파일의 특정 이름을 원하는 경우 output.minified.js

간단한 웹 사이트에 정말 유용하다고 생각합니다.

스크립트 그룹화는 비생산적이므로 http://yepnopejs.com/ 또는 http://headjs.com 과 같은 것을 사용하여 병렬로로드해야합니다 .

이 스크립트를 메모장에 복사하고 .vbs 파일로 저장합니다. 이 스크립트에 .js 파일을 끌어다 놓습니다.

추신. 이것은 창에서만 작동합니다.

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

orangutancloud가 제안하는대로 Closure-compiler를 사용할 수 있습니다. 실제로 JavaScript를 컴파일 / 축소 할 필요 가 없으며 JavaScript 텍스트 파일을 단일 텍스트 파일로 간단히 연결하는 것이 가능해야 한다는 점을 지적 할 가치가 있습니다. 일반적으로 페이지에 포함 된 순서대로 가입하면됩니다.

PHP를 실행하는 경우 CSS와 JS 모두에 대해 즉석에서 결합하고 축소하므로 Minify를 권장 합니다. 구성한 후에는 정상적으로 작동하고 모든 것을 처리합니다.

KjsCompiler를 사용할 수 있습니다 : https://github.com/knyga/kjscompiler Cool 종속성 관리

내가 만든 스크립트를 사용할 수 있습니다. 그래도 이것을 실행하려면 JRuby가 필요합니다. https://bitbucket.org/ardee_aram/jscombiner ).

이것을 차별화하는 것은 자바 스크립트의 파일 변경을 감시하고 선택한 스크립트에 자동으로 결합한다는 것입니다. 따라서 테스트 할 때마다 자바 스크립트를 수동으로 "빌드"할 필요가 없습니다. 도움이 되었기를 바랍니다. 저는 현재 이것을 사용하고 있습니다.

이것은 약간의 노력이 될 수 있지만 codeplex에서 내 오픈 소스 위키 프로젝트를 다운로드 할 수 있습니다.

http://shuttlewiki.codeplex.com

여기에는 http://yuicompressor.codeplex.com/ 프로젝트 를 사용하는 CompressJavascript 프로젝트 (및 CompressCSS)가 포함되어 있습니다 .

코드는 설명이 필요하지 않지만 파일을 결합하고 압축하는 것이 조금 더 간단합니다 .--- 어쨌든 나에게는 :)

ShuttleWiki 프로젝트는 빌드 후 이벤트에서 사용하는 방법을 보여줍니다.