it-gundan.com

css / js 파일을 자동으로 결합하려면 무엇을 사용해야합니까?

자바 스크립트 파일을 결합하는 데 sprockets 알고 있지만 시도하지 않았습니다. 다른 옵션은 무엇이며 어떻게 쌓입니까?

14
Cebjyre

YUI를 사용하여 출력을 압축, 연결 및 캐시하는 Asp.Net에 대한 처리기를 작성했습니다.

소스는 다음과 같습니다. http://Gist.github.com/13091

4
travis

이 문제를 이미 다른 질문에서 해결했습니다.

뒤늦게, 나는 프로그래머 사이트 대신 웹 마스터에게 요청 했어야했다.

3 가지 옵션이 있습니다 :

  1. 프레임 워크에서 자동 처리
  2. 웹 서버가 자동으로 처리하도록하십시오
  3. 직접 옵션을 롤링하여 수동으로 수행

옵션 1 (CakePHP 확장 사용) :

AssetPacker 사이트에 다운로드하여 설치하십시오 (jsmin 및 CSSTidy도 필요함). js 파일을 포함하는 몇 줄의 소스를 수정하십시오. 세척-> 헹굼-> 반복. Voila, 나머지는 자동으로 수행됩니다.

다른 프레임 워크를 사용하는 경우이를 수행 할 수있는 도구가 있습니다. webdev 세계에서 매우 일반적인 요구 사항입니다.

옵션 2 (Apache 모드 사용) :

Google Pagespeed mod for Apache 를 살펴보십시오. 그것은 당신이 묘사하는 모든 것과 훨씬 더 많은 일을합니다.

그래도 프로덕션 서버의 리소스를 모니터링하십시오. 일부 사람들은 이것이 서버의로드를 나쁜 방식으로 증가시키는 문제를 목격했습니다. 긍정적이지 않지만 효과적인 옵션이 되려면 충분한 정적 콘텐츠 전략이 필요할 수 있습니다.

옵션 3 :

정말로 원한다면 JS 파일 서버 측을 연결하고 모든 링크 관계를 하나로 결합하는 PHP 마술을 만들 수 있습니다 ... 두 전략이 이미 진행중인 방식입니다.

개인적으로이 옵션에 대해 강력히 권합니다.


Sprockets가 AssetPacker와 동일한 JS 파일을 연결하는 한 Ruby Gem으로 구현되었습니다. 그것이하지 않는 것은 js 코드를 축소하는 것입니다. 당신이 그것을 사용한다면, 아마도 jsmin gem을 잡는 것이 좋습니다. CakePHP에서 Sprockets + JSMin을 사용하는 방법에 대한 정보는 this 를 확인하십시오.

나는 CakePHP에 중점을 둔다는 것을 알고 있지만 ... 플러그인을 CakePHP에 적용 할 수 있다면 다른 프레임 워크에도 적용하는 것이 쉽지 않을 것이라고 가정합니다.

2
Evan Plaice

Webapp이 PHP에 있으면 minify 사용을 고려해야합니다.

여러 CSS 또는 Javascript 파일을 결합하고 불필요한 공백과 주석을 제거하고 gzip 인코딩 및 최적의 클라이언트 측 캐시 헤더와 함께 제공합니다.

1
Tom

빠른 Google 검색을 통해 CSS 파일을 결합 할 수 있습니다. http://www.tothepc.com/archives/combine-merge-multiple-css-files/

1
Macha

당신은 그들을 결합 하시겠습니까? 공통 라이브러리를 사용하는 경우 CDN을 활용하여 자바 스크립트를 제공 할 수 있습니다. 그런 다음 브라우저 캐싱 (다른 사이트에서 동일한 CDN을 사용한다고 가정) 및 분산 전송을 활용할 수 있습니다. MicrosoftGoogle 각각 솔루션이 있습니다 (정직하게 사용하지는 않았지만 확실히 시작할 것입니다).

1
Larry Smithmier

ASP.NET 프로젝트의 경우 Karl Seguin의 지침 을 기반으로 빌드 프로세스의 일부로 만들었습니다.

Karl은 그의 블로그에서 가장 잘 설명하지만 짧은 버전은 YUICompressor를 감싸는 콘솔 앱을 설정하는 것입니다. 그런 다음 사이트에서 JS 파일의 위치에 대해 해당 콘솔 앱을 호출하도록 빌드 후 작업을 설정할 수 있습니다.

1
Raleigh Buckner

이를 위해 Python을 아는 것이 실제로 유용 할 수 있습니다. Python을 매우 빨리 배울 수 있습니다. 나는 약 2 주 전에 시작했으며 첫 번째 응용 프로그램 (아직 완료되지 않음)은 원하는 것과 똑같은 일을 할 것입니다. DotLess 컴파일러와 마찬가지로 파일이나 디렉토리를 볼 수있는 감시 기능을 갖게되며, 변경되면 새 파일을 생성합니다.

파이썬은 다른 유지 관리 작업에도 적합하며 많은 시스템 관리자가 사용하는 것을 좋아합니다.

1
Pickels

Minifpy : 파이썬을 사용하여 JS와 CSS 파일을 병합하고 축소하기 위해 Python3 (Mac OS, Windows 및 Linux 호환)으로 작성된 도구를 만들었습니다.

Minifpy는 매우 쉬운 JSON 구성 파일을 사용하여 병합, 축소 또는 축소 할 파일을 정의합니다.

{
    "js": {
        "minify_files": [
            {"from": "static/file.js", "to":"static/file.min.js"},
        ],
        "merge_files": [
            {"from" : ["static/file1.js", "static/file2.js"], "to":"static/public.js", "to_min": "static/public.min.js"}
        ]
    },
    "css" : {
        "minify_files": [
            {"from": "static/file.css", "to":"static/file.min.css"},
        ],
        "merge_files": [
            {"from" : ["static/file1.css", "static/file2.css"], "to":"static/public.css", "to_min": "static/public.min.css"}
        ]
    }
}

CLI에서이 도구를 사용할 수도 있습니다.

Minifpy는 JS/CSS 파일의 수정 사항을 감지하여 자동으로 병합/축소합니다 (개발에 유용함).

0
Samuel Dauzon