Jekyll Bootstrap

Environement de Dev Java & JavaScript Supporting tagline

JavaScript

Pré-requis

Si elles ne sont pas déjà présentent, installer en globale les applications suivantes:

  • node.js : utiliser l’installeur du site de Node.js

  • grunt-cli : npm install -g grunt-cli

  • bower : npm install -g bower

Grunt

Toutes les installations suivantes sont locales.

Grunt ‘itself’

npm install grunt --save-dev

concatenation & copy

npm install grunt-contrib-concat --save-dev
npm install grunt-contrib-copy --save-dev

clean

npm install grunt-contrib-clean --save-dev

Server & proxy

server

npm install grunt-contrib-connect --save-dev

ATTENTION: si on met en place “watch” ent utilisant “connect”, il faut mettre “keepalive : false” dans la task “connect”!!
https://github.com/gruntjs/grunt-contrib-watch/issues/111

proxy

le proxy permet de résoudre les problèmes de Same-origin policy.

npm install grunt-connect-proxy --save-dev

ATTENTION : c’est le bordel !!!
=> si je redirige tout sur le serveur java context: '/' , alors je ne charge plus index.html qui est dans le projet JavaScript.
=> si je ne met que context: '/api/' , je ne vais plus sur le serveur java pour les 404 par exemple.

Du coup, mise en place d’un filtre CORS coté serveur java.

TU

npm install grunt-karma --save-dev
npm install karma-jasmine@2_0 --save-dev  // jasmine 2
karma init karma.conf.js

watch

npm install grunt-contrib-watch --save-dev

livereload ≠ watch !!

livereload permet que le navigateur soit synchronisé automatiquement avec le code.
watch observe si il y a des changements sur un ensembles de fichiers/répertoires et lance une (des) tache(s) grunt si c’es le cas.

MAIS, maintenant, livereload est embarqué dans ‘grunt-contrib-watch’ !!

Exemple de fichier Gruntfile.js

Gruntfile.js

avec ce fichier, il faut lancer karma + [task_name], par exemple :

grunt karma:unit:start dev

Bower

configuration

Définir l’emplacement des dépendances dans le fichier .boxerrc

{
   "directory" : "vendor"
}

Dépendances

Récupérer les dépendances suivantes :

  • angular
  • angular-resource
  • angular-route
  • angular-mocks (nécessaire aux TU)

soit:

bower install angular --save
bower install angular-resource --save
bower install angular-route --save
bower install angular-mocks --save

Published

01 October 2014

Tags