Veille Techno 2018 S1

Webpack 4

Webpack 4 (release announcement) & new Plugin system (tuto complet)

CommonsChunkPlugin (blog) a été remplacé par optimization.splitChunks
une propriété mode (défaut production) permet de setter l’environnement dans le webpack.config.js et webpack peut etre lancé avec les flags -d et -p
0CJS : aucune configuration n'est nécessaire pour un démarrage rapide (sans entry et output)

Webpack et Visual Studio 2017

VS dispose d'une extension WebPack Task Runner, qui permet d'avoir la config de Webpack accessible depuis le Task Runner de Visual Studio et de pouvoir lancer les différentes taches à travers une GUI. Voici une step by step pour gérer Webpack depuis Visual Studio 2015 mais en résumé:

installer l'extension de Mads Kristensen dans Visual Studio (fonctionne dans VS2015 et VS2017)
Webpack doit être installé globalement
le fichier de conf webpack.config.js doit etre à la racine du projet pour être visible de l'extension VS

NPM et Proxy des requetes Ajax

Lorsqu'on dév un projet disposant d'une Webapi qui tourne sur un backend (ci-dessous la config d'un projet create-react-app), il faut spécifier les ports utilisés à NPM dans le package.json via un objet "proxy" pour que les appels Ajax de l'application soient redirigés vers le serveur API:

"scripts": { "start": "PORT=3001 react-scripts start", "build": "react-scripts build", "test": "react-scripts test --env=jsdom", "eject": "react-scripts eject" }, "proxy": { "/api": { "target": "http://127.0.0.1:3000", "changeOrigin": true } }

NPM Misc

npm install --only=prod[uction] installs only dependencies
npm install --only=dev[elopment] installs only devDependencies
npx permet d’exécuter un package npm binaires (livré avec npm > 5.2) et voici un repo avec des ressources "compatibles" npx (ex: utiliser avec PM2 installé en Webpack dependencies) NPX nous donne une raison de plus pour éviter le npm -g !
npm versionning

Article sur dependencies vs devDependencies sur Medium

MAJ Kendo UI R1 2018 avec la nouvelle kendo-react-grid réécrite en React (fini le wrapper jQuery 🤮)

VueJs resources

SSR avec Reactjs

4 articles intéressants:

tutoriel

web

rédigé le 20/05/18 par Behrouze