Nodejs, npm, git et dépendances

Node.js est l’environnement d’exécution Javascript. (en particulier pour le serveur)

npm est le gestionnaire de paquets de Node.js.

npm est systématiquement installé avec Node.js .

Sous Ubuntu 16.04, la version Node.js des dépôts est plutôt ancienne. Il nous faut au minimum la version 8. Pour la télécharger, taper dans une console:

$ curl ­sL https://deb.nodesource.com/setup_8.x | sudo ­E bash ­
$ sudo apt-­get install nodejs

Les dépendances des composants sont gérées avec npm

• Un composant peut utiliser, par exemple, les paquets npm suivants:
  • vue notre framework javascript, aussi appelé vuejs
  • leaflet une librairie de cartographie
  • vue- i18n une librairie d’internationalisation pour vue
  • …
• npm gère aussi les dépendances à des modules provenant de dépôts git, comme nos propres composants versionnés sous github:
  • formater-commons-components-vjs : un ensemble de composants web de base, comme une boite de messages ou un sélecteur de langues.
• par ailleurs, certains des modules sont utilisés uniquement comme outils de développement comme:
  • webpack, un « bundler » de modules. (Il regroupe les fichiers javascript suivant leur dépendance et construit un fichier pouvant être utiliser dans un navigateur)
  • babel qui permet de servir différents types de format de fichiers
  • …

Les dépendances des composants sont déclarés dans leur fichier package.json respectif.

{
  "name": "formater-commons-components-vjs",
  "version": "0.13.1",
  "description": "commons components for poleterresolide",
  "preproduction": {
    "url": "https://api.poleterresolide.fr/"
  },
  "repository": {
    "type": "git",
    "url": "git+https://github.com/terresolide/formater-commons-components-vjs.git"
  },
  "keywords": [
    "vue.js"
  ],
  "private": false,
  "author": "epointal",
  "license": "GNU",
  "scripts": {
    "dev": "cross-env NODE_ENV=development webpack-dev-server --progress --open --hot --inline",
    "build": "cross-env NODE_ENV=production webpack --progress --hide-modules"
  },
  "dependencies": {
    "aeris-commons-components-vjs": "github:aeris-data/aeris-commons-components-vjs#0.3.1",
    "vue": "^2.5.17",
    "vue-custom-element": "^1.4.4",
    "vue-i18n": "7.0.5",
    "vue-resource": "^1.5.1"
  },
  "devDependencies": {
    "@kazupon/vue-i18n-loader": "0.1.1",
    "babel-core": "^6.26.3",
    "babel-loader": "^6.0.0",
    "babel-preset-env": "^1.7.0",
    "clean-webpack-plugin": "^0.1.19",
    "cross-env": "^3.0.0",
    "css-loader": "^0.25.0",
    "exports-loader": "^0.6.4",
    "file-loader": "^0.9.0",
    "style-loader": "^0.18.2",
    "url-loader": "^1.1.2",
    "vue-loader": "^12.1.0",
    "vue-template-compiler": "^2.5.17",
    "webpack": "^2.6.1",
    "webpack-dev-server": "^2.11.3"
  }
}

Voici, la procédure générale pour commencer un projet (npm) de zéro. Créer un répertoire mon-projet, puis dans ce répertoire initialiser votre projet en tapant npm init à la racine de votre répertoire, il vous sera demandé nom, version, point d'entrée… etc

$ mkdir mon-projet
$ cd mon-projet
$ npm init
This utility will walk you through creating a package.json file.
It only covers the most common items, and tries to guess sensible defaults.

See `npm help json` for definitive documentation on these fields
and exactly what they do.

Use `npm install <pkg>` afterwards to install a package and
save it as a dependency in the package.json file.

Press ^C at any time to quit.
package name: (mon-projet) 
version: (1.0.0) 
description: description du projet
entry point: (index.js) 
test command: 
git repository: 
keywords: 
author: 
license: (ISC) 
About to write to /mon-projet/package.json:

{
  "name": "mon-projet",
  "version": "1.0.0",
  "description": "description du projet",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "author": "",
  "license": "ISC"
}


Is this OK? (yes) 

Un fichier package.json est alors créé à la racine de votre répertoire