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>

Si vous aimez ce que nous faisons à Cipher Bliss, vous pouvez nous soutenir de plusieurs façons: en faisant un micro don sur liberapay , ou en cryptomonnaies. Le plus simple nous pour nous faire connaître étant de partager cet article.
Suivez moi sur Mastodon @tykayn@mastodon.cipherbliss.com.
Ce site restera libre comme un gnou dans la nature et sans pubs, parce qu'on vous aime. Que la source soit avec vous!

Laisser un commentaire

Votre adresse e-mail ne sera pas publiée. Les champs obligatoires sont indiqués avec *

Ce site utilise Akismet pour réduire les indésirables. En savoir plus sur comment les données de vos commentaires sont utilisées.