Automatiquement Minify CSS et Javascript sur le téléchargement

Est-ce que quelqu'un connaît un bon moyen d'exécuter automatiquement certains types de fichiers via un script de traitement lors du téléchargement? J'essaie d'effectuer automatiquement le CSS et le Javascript lorsque je les télécharge sur le serveur, en gardant une version agréable, lisible par l'homme sur le côté local tout en gardant un minifié sur le serveur. J'utilise actuellement WinSCP sur Windows, qui est scriptable dans une certaine mesure, mais peut-être pas assez scriptable. J'aurais probablement besoin d'une sorte de solution cobbled, alors n'ayez pas peur de suggérer quelque chose avec du ruban adhésif; Cependant, je dois faire les minifications sur mon ordinateur local et télécharger le fichier squished, car j'utilise l'hébergement partagé et je ne peux pas installer de la malveillance sur le serveur.

Merci.

Je recommande de créer un makefile pour résoudre ce problème particulier, voici un makefile rapide et sale que j'utilise pour un site à moi.

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} 

Ensuite, tout ce que vous devez taper est:

 make && make install 

Tout d'abord, il prend tous vos fichiers de développement et les concatène dans un seul fichier, puis le fichier concaténé est compressé et copié dans votre répertoire public. J'utilise YUICompressor pour la compression, ça marche très bien.

Eh bien, pour minimiser CSS, il ne s'agit que de quelques regexes.

 // (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) ) ) ; } 

Et le packer Javascript de Dean Edwards a été porté vers PHP, Perl, .NET et WSH , donc, si vous utilisez une de ces technologies, vous pourriez l'utiliser sur votre propre serveur. … N'oubliez pas de mettre en cache les résultats!

Comme vous êtes sur l'hébergement partagé, je propose simplement d'utiliser YUICompressor et d'exécuter vos fichiers css / js avant de les télécharger. Assurez-vous de ne pas perdre vos fichiers originaux – cela pourrait être une douleur qui fait des changements futurs.

Vous pouvez également placer un script sur votre serveur qui réécrit périodiquement vos fichiers css / js, en les passant par un processus minify et en appelant manuellement après avoir effectué un téléchargement.

J'aime Minify . Il supporte la compression et la coupe de html, javascript et css à la volée.

C'est assez flexible, on peut l'intégrer aux applications existantes.

Certaines des fonctionnalités les plus avancées combinent plusieurs fichiers javascript en un, même pour css. Il a plusieurs façons de définir les fichiers à combiner, ce qui est utile à des fins de test. De cette façon, vous ne devez pas modifier les paramètres à chaque fois.

Je viens d'écrire ce script minfier en python. Comme la solution Bills, elle utilise le compresseur YUI, mais fonctionnera dans un environnement sans compromis. Il suppose que les fichiers bruts (non minifie) seront dans / some / path / src /, et que les versions minifiées devront être dans / some / path /. Il suppose également que le fichier jj de yuicompressor se trouve dans le dossier actuel:

 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) 

Je suggère de compresser (par tous les moyens de manière automatisée) sur votre machine de développement et de le tester avant de télécharger sur votre serveur en direct. La modification fondamentale de votre JavaScript en tant que dernière étape de votre processus de déploiement est un risque évident d'introduction d'erreurs.

Realy cool solution qui fait servir js et css automatiquement comme un rêve.

Vérifiez: http://code.google.com/p/minify/

Caractéristiques

  • Combine et minifie plusieurs fichiers CSS ou JavaScript en un seul téléchargement
    • Utilise un port amélioré de la bibliothèque JSMin de Douglas Crockford et des classes personnalisées pour minify CSS et HTML
    • Caches côté serveur (fichiers / apc / memcache) pour éviter de faire des travaux inutiles
    • Répond à une réponse HTTP 304 (non modifiée) lorsque le navigateur dispose d'une copie de cache mise à jour
    • La plupart des modules sont embarqués en fonction du besoin (304 réponses utilisent un code minimal)
    • Réécrit automatiquement les URI relatifs dans les fichiers CSS combinés pour indiquer des emplacements valides
    • Avec la mise en cache activée, Minify est capable de gérer des centaines de requêtes par seconde sur un serveur modérément puissant.
    • Codage de contenu: gzip, basé sur les en-têtes de requête. La mise en cache permet de servir les fichiers gzips plus rapidement que l'option mod_deflate d'Apache!
    • Cas d'essai pour la plupart des composants
    • Intégration facile des minifiers tiers
    • Séparez les classes d'utilité pour le codage HTTP et le contrôle du cache enter code here

Il existe une solution encore plus claire pour les deux (JS et CSS) afin que vous puissiez "minifier à la volée". Vous devriez pouvoir le rendre facilement à n'importe quelle langue (il est actuellement en PHP). C'est vraiment un fragment et une partie intégrante du PHP Fat-Free Framework. Suivez ce lien et regardez mon code. C'est une seule fonction. Ne cherchez pas les cloches et les sifflets comme la combinaison de fichiers, le codage base X, le raccourcissement des variables ou même le codage gzip (bien que cela puisse être ajouté facilement).

Minify sans graisse