gulpifie ton prestashop

Vous êtes dev front end et aimeriez avoir du livereload quand vous bossez sur un thème prestashop?
Gulpifiez votre prestashop!  (ou en fait non, fuyez tant qu’il en est encore temps)

dans votre terminal favori, dans la racine de votre projet prestashop faites ceci:
Installons localement gulp et browser-sync avec node package manager:

 npm i –save-dev gulp browser-sync

ça mouline quelques temps, ensuite créez un fichier Gulpfile.js toujours à la racine de votre projet
et remplissez le de ceci:

/**

gulpify script of tykayn
https://github.com/tykayn/blog.artlemoine.com
http://artlemoine.com
to run this you need bash to install dependencies:
npm i -D gulp browser-sync --save-dev;
gulp
**/

var serverName = 'latrotteuse.lan'; // you NEED to have a vhost of this name setup
var gulp = require('gulp');
var browserSync = require('browser-sync');

// Static server.
gulp.task('browser-sync', function () {

   // init server
   browserSync.init({
       proxy: serverName + "/"
   });
   // the server will automatically reload on change
   var filesToWatch = ["themes/**/*.tpl",
       "themes/**/*.js",
       "themes/**/*.css",
       "themes/**/*.html",
       "src/**/*.php"];
   gulp.watch(filesToWatch)
     .on('change', browserSync.reload);

});

gulp.task('default', 'browser-sync');

il vous faudra définir un virtual host pour que ça fonctionne.
on a donc un fichier minimal, avec une tâche par défaut qui lance un serveur web local sur le port 3000 et qui recharge le browser à la modification d’un fichier dans le répertoire de thèmes.
wouala, enjoyez!</span>
</pre>

CatégoriesNon classé