Node.js
Chargement automatique des modifications

Autoreload sur les modifications du code source à l'aide de nodemon

Le paquet nodemon permet de recharger automatiquement votre programme lorsque vous modifiez un fichier du code source.

Installer nodemon globalement

npm install -g nodemon (ou npm i -g nodemon )

Installer nodemon localement

Au cas où vous ne voulez pas l'installer globalement

npm install --save-dev nodemon (ou npm i -D nodemon )

Utiliser nodemon

Exécutez votre programme avec nodemon entry.js (ou nodemon entry )

Cela remplace l'utilisation habituelle de node entry.js (ou node entry ).

Vous pouvez également ajouter votre démarrage nodemon en tant que script npm, ce qui peut être utile si vous souhaitez fournir des paramètres et ne pas les taper à chaque fois.

Ajouter package.json:

  "scripts": {
    "start": "nodemon entry.js -devmode -something 1"
  }

De cette façon, vous pouvez simplement utiliser npm start depuis votre console.

Browsersync

Vue d'ensemble

Browsersync est un outil qui permet de regarder des fichiers en direct et de recharger un navigateur. Il est disponible en paquet NPM .

Installation

Pour installer Browsersync, vous devez d'abord installer Node.js et NPM. Pour plus d'informations, consultez la documentation SO relative à l' installation et à l'exécution de Node.js.

Une fois votre projet configuré, vous pouvez installer Browsersync avec la commande suivante:

$ npm install browser-sync -D

Cela va installer Browsersync dans le node_modules local node_modules et l'enregistrer dans les dépendances de votre développeur.

Si vous préférez l'installer globalement, utilisez l' -g à la place de l' -D .

Utilisateurs Windows

Si vous ne parvenez pas à installer Browsersync sous Windows, vous devrez peut-être installer Visual Studio pour pouvoir accéder aux outils de génération pour installer Browsersync. Vous devrez ensuite spécifier la version de Visual Studio que vous utilisez comme suit:

$ npm install browser-sync --msvs_version=2013 -D

Cette commande spécifie la version 2013 de Visual Studio.

Utilisation de base

Pour recharger automatiquement votre site chaque fois que vous modifiez un fichier JavaScript dans votre projet, utilisez la commande suivante:

$ browser-sync start --proxy "myproject.dev" --files "**/*.js"

Remplacez myproject.dev par l'adresse Web que vous utilisez pour accéder à votre projet. Browsersync affichera une autre adresse pouvant être utilisée pour accéder à votre site via le proxy.

Utilisation avancée

Outre l'interface de ligne de commande décrite ci-dessus, Browsersync peut également être utilisé avec Grunt.js et Gulp.js.

Grunt.js

L'utilisation de Grunt.js nécessite un plugin qui peut être installé comme ceci:

$ npm install grunt-browser-sync -D

Ensuite, vous allez ajouter cette ligne à votre gruntfile.js :

grunt.loadNpmTasks('grunt-browser-sync');

Gulp.js

Browsersync fonctionne comme un module CommonJS , donc pas besoin d'un plugin Gulp.js. Simplement besoin du module comme ceci:

var browserSync = require('browser-sync').create();

Vous pouvez maintenant utiliser l' API Browsersync pour le configurer selon vos besoins.

API

L'API Browsersync peut être trouvée ici: https://browsersync.io/docs/api