programing

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

stoneblock 2023. 8. 27. 08:50

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

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

구글은 모든 jquery 스크립트 파일을 하나의 파일로 결합할 것을 제안했습니다.

어떻게 해야 하나요?

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

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

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

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

텍스트 파일을 결합한 다음 YUI 압축기와 같은 것을 사용하면 됩니다.

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

2014년 8월 업데이트

저는 이제 다양한 플러그인과 최소한의 구성으로 자바스크립트 연결 및 압축을 위해 Gulp를 사용하는 것으로 전환했습니다. 의존성 설정, 커피 스크립트 컴파일 등을 수행하고 JS를 압축할 수 있습니다.

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

  • 수동: 모든 Javascript 파일을 하나로 복사하고 압축기(선택 사항이지만 권장 사항)를 실행한 후 서버에 업로드하고 해당 파일에 연결합니다.
  • PHP 사용: 모든 JS 파일의 배열을 만들고,include그들 모두와 출력을 a로.<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.js구글의 폐쇄 컴파일러에 의해 축소되었습니다. 또는 :

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

최소화된 파일의 이름을 지정하려면 다음과 같이 하십시오.output.minified.js

저는 그것이 간단한 웹사이트에 정말 도움이 된다고 생각합니다.

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

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

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

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

오랑우탄 클라우드가 제안하는 대로 Closure-compiler를 사용할 수 있습니다.자바스크립트를 실제로 컴파일/최소화할 필요가 없으며 자바스크립트 텍스트 파일을 하나의 텍스트 파일로 연결하는 것이 가능해야 한다는 점을 지적할 필요가 있습니다.일반적으로 페이지에 포함된 순서대로 참가하면 됩니다.

만약 당신이 PHP를 실행하고 있다면, 미니파이를 추천합니다. 왜냐하면 그것은 CSS와 JS 모두에 대해 즉시 결합하고 최소화하기 때문입니다.구성한 후에는 정상적으로 작업하면 모든 것이 처리됩니다.

KjsCompiler: https://github.com/knyga/kjscompiler 쿨 의존성 관리를 사용할 수 있습니다.

당신은 제가 만든 대본을 사용할 수 있습니다.하지만 이것을 운영하려면 JRuby가 필요합니다.https://bitbucket.org/ardee_aram/jscombiner (JS Combiner).

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

이것은 약간의 노력일 수 있지만 당신은 코데플렉스에서 내 오픈 소스 위키 프로젝트를 다운로드할 수 있습니다.

http://shuttlewiki.codeplex.com

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

코드는 자체적으로 설명할 수 있어야 하지만 파일을 결합하고 압축하는 것을 조금 더 간단하게 만듭니다. 어쨌든 저에게는 :)

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

언급URL : https://stackoverflow.com/questions/5511989/combine-multiple-javascript-files-into-one-js-file