Cipher Bliss

Mot-clé - repstashop

Fil des billets - Fil des commentaires

mardi 29 mars 2016

gulpifie ton prestashop

<p>Vous êtes dev front end et aimeriez avoir du livereload quand vous bossez sur un thème prestashop? Gulpifiez votre prestashop! &nbsp;(ou en fait non, fuyez tant qu'il en est encore temps)</p> <p>dans votre terminal favori, dans la racine de votre projet prestashop faites ceci: Installons localement gulp et browser-sync avec node package manager:</p> <p>&nbsp;npm i --save-dev gulp browser-sync</p> <p>ça mouline quelques temps, ensuite créez un fichier Gulpfile.js toujours à la racine de votre projet et remplissez le de ceci:</p> <pre><code>/**

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'); </code></pre> 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!&lt;/span&gt; &lt;/pre&gt;</p>