Автоматически минимизировать CSS и Javascript при загрузке

Question

Кто-нибудь знает хороший способ автоматического запуска определенных типов файлов через скрипт обработки при загрузке? Я пытаюсь выполнить автоматическую минимизацию CSS и Javascript, когда загружаю их на сервер, сохраняя удобную, удобочитаемую версию на локальной стороне, сохраняя минимизированную версию на сервере. В настоящее время я использую WinSCP в Windows, которая в некоторой степени является сценарием, но может быть недостаточно сценарием. Мне, вероятно, понадобится какое-нибудь мощное решение, поэтому не бойтесь предлагать что-то с клейкой лентой; тем не менее, мне нужно выполнить минификацию на моем локальном компьютере и загрузить загруженный файл, поскольку я использую виртуальный хостинг и не могу установить нежелательную почту на сервер.

Спасибо.

Answer 1

Я рекомендую создать make-файл для решения этой конкретной проблемы, вот быстрый и грязный make-файл, который я использую для своего сайта:

PUBDIR=../../static/js/
OUTDIR=./build/
COMPRESSOR=../yui/build/yuicompressor-2.4.2.jar
ARGS=
VPATH=${OUTDIR}
INST_TARGETS=${OUTDIR}jgblue.js

jgblue.js: combined.js
    java -jar ${COMPRESSOR} ${ARGS} ${OUTDIR}$< -o ${OUTDIR}$@

combined.js: main.js listview.js tabs.js
    cat $^ > ${OUTDIR}$@

.PHONY: install

install:
    cp ${INST_TARGETS} ${PUBDIR}

Тогда все, что вам нужно набрать:

make && make install

Сначала он берет все ваши файлы разработки и объединяет их в один файл, затем объединенный файл сжимается и копируется в ваш публичный каталог. Я использую YUICompressor для сжатия, он работает довольно хорошо.

Answer 2

Ну, чтобы минимизировать CSS, это всего лишь пара регулярных выражений.

// (PHP) but should be easily portable to any language
function compressCSS($css) {
    return
        preg_replace(
            array('@\s\s+@','@(\w+:)\s*([\w\s,#]+;?)@'),
            array(' ','$1$2'),
            str_replace(
                array("\r","\n","\t",' {','} ',';}'),
                array('','','','{','}','}'),
                preg_replace('@/\*[^*]*\*+([^/][^*]*\*+)*/@', '', $css)
            )
        )
    ;
}

И упаковщик Javascript Дина Эдвардса был портирован на PHP, Perl, .NET и WSH , поэтому, если вы используете любую из этих технологий, вы можете запустить ее на своем собственном сервере. ... Просто не забудьте кэшировать результаты!

Answer 3

Поскольку вы пользуетесь виртуальным хостингом, я бы просто предложил использовать YUICompressor и пропустить через него файлы css / js до их загрузки. Будьте уверены, чтобы не потерять свои оригинальные файлы - это может быть боль внесения будущих изменений.

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

Answer 4

Я только что написал этот скрипт minfier на python. Как и решение Bills, в нем используется YUI-компрессор, но он будет работать в беззаботной среде. Предполагается, что необработанные (unminifie) файлы будут находиться в / some / path / src /, а минимизированные версии должны находиться в / some / path /. Также предполагается, что файл jar yuicompressor находится в текущей папке:

import os, glob
from subprocess import Popen,PIPE

def RunCommand( cmd, show_output  ):
    p = Popen(cmd, shell=True,stdout=PIPE,stderr=PIPE)
    for line in p.stdout:
        if show_output:
            print line


    outerr = "\n".join(p.stderr.readlines() )   

    if len(outerr) > 0:
        print "ERROR: " + outerr
        sys.exit()

    code = p.wait()         
    if ( code > 0 ):
        print ("ERROR CODE: %i" % code )
        sys.exit()



compresser = "yuicompressor-2.4.2.jar"
dirs = [ "../wwwroot/css/", "../wwwroot/JavaScript/"]

extensions = ["*.js", "*.css" ]

for dir in dirs:
    src = dir + "/src/"
    for ext in extensions:      
        for path in glob.glob( os.path.join( src, ext)):
            file = os.path.basename(path)
            src_file = os.path.normpath( src + "/" +  file )
            dest_file = os.path.normpath( dir + "/" + file )
            if not os.path.isfile(dest_file) or os.path.getmtime(src_file) > os.path.getmtime(dest_file):
                print "minifying %s..." % (dest_file) 
                command = "java -jar %s %s -o %s" % ( compresser, src_file, dest_file )
                RunCommand(command, True)

Answer 5

Мне нравится Minify . Он поддерживает сжатие и усечение html, javascript и css на лету.

Он достаточно гибкий, его можно интегрировать в существующие приложения.

Некоторые из расширенных функций объединяют несколько файлов javascript в один, то же самое для css. Он имеет несколько способов определения, какие файлы объединять, что полезно для тестирования. Таким образом, вам не нужно каждый раз изменять настройки.

Answer 6

Действительно классное решение, которое делает подачу js и css автоматически, как сон.

Проверка: http://code.google.com/p/minify/

Особенности

• Объединяет и минимизирует несколько файлов CSS или JavaScript в одной загрузке
  • Использует расширенный порт библиотеки Дугласа Крокфорда JSMin и пользовательские классы для минимизации CSS и HTML
  • Кэширует на стороне сервера (files / apc / memcache), чтобы избежать ненужной работы
  • Отвечает ответом HTTP 304 (не изменено), когда в браузере установлена ​​последняя копия кэша
  • Большинство модулей загружаются по мере необходимости (304 ответа используют минимальный код)
  • Автоматически переписывает относительные URI в комбинированных файлах CSS для указания на допустимые местоположения
  • С включенным кэшированием Minify способен обрабатывать сотни запросов в секунду на умеренно мощном сервере.
  • Content-Encoding: gzip, основанный на заголовках запросов. Кэширование позволяет ему обслуживать сжатые файлы быстрее, чем опция mod_deflate в Apache!
  • Контрольные примеры для большинства компонентов
  • Простая интеграция сторонних минифинеров
  • Отдельные служебные классы для кодирования HTTP и управления кешем enter code here

Answer 7

Я предлагаю сжать (во что бы то ни стало, каким-либо автоматическим способом) на вашей машине для разработки и протестировать его там перед загрузкой на ваш действующий сервер. Фундаментальное изменение вашего JavaScript в качестве последнего этапа процесса развертывания является очевидным риском для ошибок.

Answer 8

Существует даже более легкое решение для обоих (JS и CSS), так что вы можете "минимизировать на лету". Вы должны быть в состоянии легко перенести его на любой язык (в настоящее время он на PHP). Это действительно фрагмент и неотъемлемая часть PHP Fat-Free Framework. Перейдите по этой ссылке и посмотрите мой код. Это всего лишь одна функция. Не ищите наворотов, таких как объединение файлов, кодировка base-X, сокращение переменных или даже кодировка gzip (хотя это можно легко добавить).

Обезжиривание Minify