Clean Webpack Plugin: Διατηρήστε μια καθαρή κατασκευή

Το "CleanWebpackPlugin" είναι ένα δημοφιλές πρόσθετο για Webpack το οποίο σας βοηθά να διαχειριστείτε την έξοδο της κατασκευής σας καθαρίζοντας τους καθορισμένους καταλόγους πριν δημιουργήσετε νέα αρχεία. Αυτό μπορεί να είναι χρήσιμο για να αποτρέψετε τη συσσώρευση παλαιών ή περιττών αρχείων στον κατάλογο κατασκευής σας. Ακολουθεί μια σύντομη εξήγηση του τρόπου χρήσης του CleanWebpackPlugin:

Εγκατάσταση

Πρώτα, βεβαιωθείτε ότι έχετε εγκαταστήσει Webpack και webpack-cli έχετε εγκαταστήσει στο έργο σας, όπως φαίνεται στις προηγούμενες επεξηγήσεις. Στη συνέχεια, εγκαταστήστε το CleanWebpackPlugin:

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

Διαμόρφωση

Ανοίξτε webpack.config.js το αρχείο σας και εισαγάγετε το πρόσθετο:

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

Μέσα στον plugins πίνακα, δημιουργήστε το CleanWebpackPlugin:

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

Από προεπιλογή, η προσθήκη θα καθαρίσει τα output.path καθορισμένα στη Webpack διαμόρφωσή σας.

Προσαρμοσμένη διαμόρφωση

Μπορείτε να προσαρμόσετε τη συμπεριφορά του CleanWebpackPlugin μεταβιβάζοντας επιλογές στον κατασκευαστή του. Για παράδειγμα:

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

Σε αυτό το παράδειγμα, όλα τα αρχεία και οι κατάλογοι θα καθαριστούν εκτός από το importantFile.txt.

Τρέξιμο Webpack

Όταν τρέχετε Webpack να δημιουργήσετε το έργο σας, CleanWebpackPlugin θα καθαρίσει αυτόματα τους καθορισμένους καταλόγους πριν από τη δημιουργία νέων αρχείων έκδοσης.

Θυμηθείτε να ανατρέξετε στην επίσημη τεκμηρίωση του clean-webpack-plugin για πιο προηγμένες διαμορφώσεις και επιλογές. Αυτό το πρόσθετο μπορεί να βοηθήσει πολύ στη διατήρηση ενός καθαρού καταλόγου εξόδου κατασκευής και στην αποφυγή περιττής ακαταστασίας.