DokuWiki

This page is read only. You can view the source, but not change it. Ask your administrator if you think this is wrong.
====== Flux de travail ProcessWire 00 ======

===== structure de données =====

  .jscsrc
  /site
    /dev
      /js
      /scss
        style.scss
      /tmp // js concaténé avant passage par google closure compiler
    /templates
      /scripts/s.js
      /styles/c.css

==== mise en place ====

<code>
npm init
npm install grunt-contrib-concat --save-dev
npm install grunt-contrib-sass --save-dev
npm install grunt-contrib-watch --save-dev
npm install google-closure-compiler --save-dev
</code>

Plugin firefox pour le livereload : [[https://addons.mozilla.org/fr/firefox/addon/remotelivereload]]

==== .jscsrc ====
Sans doute à revoir, notamment parce que pas ES5.
<code>{
    "preset": "airbnb",
    "requireCamelCaseOrUpperCaseIdentifiers": null,
}
</code>

==== gruntfile.js ====
<code>
module.exports = function (grunt) {

  //require
  require('google-closure-compiler').grunt(grunt);

  // init
  grunt.initConfig({

    // concaténation des fichiers javascript
    concat: {
      dev: {
        src: ['site/dev/js/*.js'],
        dest: 'site/templates/scripts/s.js',
      },
      prod: {
        src: ['site/dev/js/*.js'],
        dest: 'site/dev/tmp/s.uncompiled.js', // todo
      },
    },

    // conversion SCSS vers CSS
    sass: {
      dev: {
        options: {
          style: 'expanded',
        },
        files: {
          'site/templates/styles/c.css': 'site/dev/scss/style.scss',
        },
      },
      prod: {
        options: {
          style: 'compressed',
          sourcemap: 'none',
        },
        files: {
          'site/templates/scripts/s.js': 'site/dev/scss/style.scss',
        },
      },
    },

    // closure compiler
    'closure-compiler': {
      prod: {
        files: {
          'site/templates/scripts/s.js': 'site/dev/tmp/s.uncompiled.js',
        },
        options: {
          compilation_level: 'ADVANCED',
          language_in: 'ECMASCRIPT5_STRICT',
        },
      },
    },

    // surveillance des répertoires
    watch: {
      options: {
        spawn: false,
        livereload: true,
      },
      script: {
        files: ['site/dev/**/*'],
        tasks: ['concat:dev', 'sass:dev'],
      },
    },

  });

  // loadNpmTasks
  grunt.loadNpmTasks('grunt-contrib-concat');
  grunt.loadNpmTasks('grunt-contrib-sass');
  grunt.loadNpmTasks('grunt-contrib-watch');

  // registerTask
  grunt.registerTask('default', ['concat:dev', 'sass:dev', 'watch']);
  grunt.registerTask('prod', ['concat:prod', 'sass:prod', 'closure-compiler:prod']);
};

</code>