/ / Existe-t-il un moyen d'automatiser la migration de Assetic vers Gulp? - symfony, gruntjs, gulp, twig, assetic

Existe-t-il un moyen d'automatiser la migration du formulaire Assetic à gulp? - symfony, gruntjs, gulp, twig, assetic

Je travaille sur un projet avec Symfony2 et il se trouve que j'utilise Assetic pour gérer css et js.

Je suis habitué à avaler / accorder des tâches mais pas avecSymfony, j'ai essayé de trouver un moyen systématique (ou automatique) d'extraire les fichiers de ressources que j'utilise dans mes modèles, de les regrouper et de remplacer les blocs assétiques en brindille par l'alternative appropriée.

Je suis sûr qu'un outil comme celui-ci va sauver la vie et aider à migrer un ancien projet d'Assetic vers un gestionnaire de tâches moderne car il est trop limité.

Une suggestion par où commencer?

Réponses:

2 pour la réponse № 1

J'ai migré d'Assetic vers Gulp, mais ce n'est pas un processus automatisé.

Dans mon cas, j'ai dû changer toute l'architecture frontale, en utilisant le 7--1 modèle. J'ai également créé un gulpfile à la racine du projet Symfony. Vous pouvez créer cela dans un ensemble, dans le Resources dossier.

En supposant que vous ne souhaitez pas modifier l'emplacement de vos fichiers, je vous recommande de suivre ces étapes:

  • Créer un package.jsonfonctionnement npm init
  • Installez gulp, browserify et tous vos packages requis.
  • Déplacez tous vos fichiers css / scss vers le app/Resources dossier. C’est une bonne pratique d’y avoir vos actifs. Par exemple, vous pouvez créer un app/Resources/styles dossier pour vos styles et app/Resources/scripts pour vos scripts.
  • Créez un gulpfile.js à la racine ou dans le dossier Resources d'un bundle.
  • Ajoutez les tâches pour compiler les fichiers scss et js en un.

    gulp.task("sass", function() {
    return gulp.src("app/Resources/styles/main.scss")
    .pipe($.sass())
    .pipe(gulp.dest("web/css/"))
    });
    
    gulp.task("browserify", function() {
    return browserify("app/Resources/scripts/main.js")
    .transform("babelify", {presets: ["es2015"]})
    .bundle()
    .pipe(source("main.js"))
    .pipe(gulp.dest("web/js"))
    });
    

le browserify La tâche compile tous vos modules javascript écrits en ES6 avec la navigation, bien sûr.

Enfin, vous pouvez ajouter des tâches à regarder, mais ce n'est pas lié à la question.

J'espère que cela aide.

Cordialement.