Le concept du Test, Commit, Revert (TCR) est sympa.

Comment notre façon de programmer est-elle devenue asynchrone et bloquante ? C'est vrai que je passe mon temps à revenir sur des pull-requests qui ont eu lieu plusieurs jours auparavant ; et c'est dur à chaque fois ! J'aime coder et oublier le code que je viens de coder aussitôt que la PR part. Je n'aime pas qu'on me relance sur un sujet que j'ai fermé car c'est une charge cognitive forte et épuisante et pourtant ce modèle est devenu le modèle "standard".

=> Pour @Chlouchloutte

Via Riduidel

Bon, je dois refaire du Webpack pour mettre à jour le build d'un tool de la boite. Comme j'ai eu beaucoup de peine à retrouver comment et quoi faire, voici un bref résumé des trucs et astuces à connaître sur Webpack.

Comment concaténer des fichiers JS inter-dépendants ?

Principe : mon fichier JS (Main.js) importe d'autres fichiers JS (cf. le mot-clef require de TypeScript / ES6). Et ces fichiers JS importent également d'autres fichiers. L'idée ici est d'avoir un Webpack qui parcours le graphe des dépendances en analysant le code afin de produire un et un seul fichier JS qui n'inclut que ce dont mon application se sert.

Contenu du fichier webpack.conf.js :

module.exports = {
    entry: {
        Car : './src/Main.js' // Charge ce fichier ainsi que tous ceux dont il dépend via le mot-clef 'require'.
    },
    output: {
        path: './target',
        filename: 'merged-file.js'
    }
};

Comment créer un bundle de fichiers JS qui n'ont aucune dépendance entre-eux ?

Principe : j'ai plein de libs écrites en JavaScript avec mes petites mimines (ou pas), ces librairies n'ont aucune dépendance entre-elles, cependant je souhaiterais les concaténer dans un gros bundle de sorte à minimiser le nombre de requêtes réseau.

Contenu du fichier webpack.conf.js :

module.exports = {
    entry: [
        './src/Car.js',     // La liste des fichiers à concaténer
        './src/Vehicule.js'
    ],
    output: {
        path: './target',
        filename: 'merged-file.js'
    }
};

Comment créer plusieurs bundles de fichiers JS qui n'ont aucune dépendance entre-eux ?

Principe : je reprends les fichiers JS du point précédent à ceci près que je souhaite créer plusieurs bundles, un pour chaque types de véhicules par exemple.

Contenu du fichier webpack.conf.js :

module.exports = {
    entry: {
        four-wheels : [
            './src/Car.js',
            './src/Vehicule.js'
        ],
        two-wheels : [
            './src/Bike.js',
            './src/Vehicule.js'
        ]
    },
    output: {
        path: './target',
        filename: '[name].bundle.js',
        chunkFilename : '[id].bundle.js'
    }
};

Comment minifier mes bundles JS ?

Principe : mes fichiers JS sont gros et je souhaite supprimer le maximum d'espace, les commentaires, réduire le nom des fonctions, variables & Co de sorte à fournir le plus petit fichier possible.

Contenu du fichier webpack.conf.js :

var webpack = require("webpack");
module.exports = {
    entry: [
        './src/Car.js',
        './src/Vehicule.js'
    ],
    output: {
        path: './target',
        filename: 'app.minified.js'
    },

    plugins: [
        new webpack.optimize.UglifyJsPlugin({minimize: true})
    ]
};

Quelques tutos sur Hibernate expliquant comment setup un projet, les updates, les merges et les locks. Bien pour démarrer.