Clean Webpack Plugin: Zorg voor een schoon gebouw

De "CleanWebpackPlugin" is een populaire plug-in Webpack waarmee u uw build-uitvoer kunt beheren door de opgegeven mappen op te schonen voordat u nieuwe bestanden genereert. Dit kan handig zijn om te voorkomen dat oude of onnodige bestanden zich ophopen in uw build-directory. Hier volgt een korte uitleg over het gebruik van de CleanWebpackPlugin:

Installatie

Zorg er eerst voor dat je hebt Webpack en webpack-cli geïnstalleerd in je project, zoals getoond in de vorige uitleg. Installeer vervolgens de CleanWebpackPlugin:

npm install clean-webpack-plugin --save-dev

Configuratie

Open uw webpack.config.js bestand en importeer de plug-in:

const { CleanWebpackPlugin } = require('clean-webpack-plugin');

plugins Instantiseer binnen de array het volgende CleanWebpackPlugin:

module.exports = {  
  // ...other configuration options  
  
  plugins: [  
    new CleanWebpackPlugin()  
    // ...other plugins  
  ]  
};  

Standaard zal de plug-in het output.path gedefinieerde in uw Webpack configuratie opschonen.

Aangepaste configuratie

U kunt het gedrag van de module aanpassen CleanWebpackPlugin door opties door te geven aan de constructor. Bijvoorbeeld:

new CleanWebpackPlugin({  
  cleanOnceBeforeBuildPatterns: ['**/*', '!importantFile.txt']  
})  

In dit voorbeeld worden alle bestanden en mappen opgeschoond behalve importantFile.txt.

Rennen Webpack

Wanneer u uitvoert Webpack om uw project te bouwen, CleanWebpackPlugin worden de opgegeven mappen automatisch opgeschoond voordat nieuwe build-bestanden worden gegenereerd.

Vergeet niet om de officiële documentatie van te raadplegen clean-webpack-plugin voor meer geavanceerde configuraties en opties. Deze plug-in kan enorm helpen bij het onderhouden van een schone build-uitvoermap en het vermijden van onnodige rommel.