Hướng dẫn minicssextractplugin
Ngày đăng:
23/09/2022
Trả lời:
0
Lượt xem:
22
Show Webpack minify CSS - OptimizeCSSAssetsPlugin
Cài đặt và xử lý minify CSSĐể tạo được file minify CSS tự động, ta cần thực hiện các bước sau:
Cài đặt plugin MiniCssExtractPluginnpm install --save-dev mini-css-extract-plugin Kết quả Cài đặt plugin OptimizeCSSAssetsPluginnpm install --save-dev optimize-css-assets-webpack-plugin Kết quả Chỉnh file |
Bài học | Lệnh đã dùng |
---|---|
Cài đặt Webpack | cd Webpack-project npm init -y npm install --save-dev webpack npm install --save-dev webpack-cli |
Webpack bundle | npx webpack |
Cấu hình Webpack | npx webpack --config webpack.config.js npm run build |
Webpack quản lý output | npm run build |
Webpack code splitting | npm install --save lodash npm run build npm run build |
Cài đặt và setting HtmlWebpackPlugin | npm install --save-dev html-webpack-plugin npm run build |
Cài đặt và setting CleanWebpackPlugin | npm install --save-dev clean-webpack-plugin npm run build |
Webpack Cache | npm run build npm run build |
Webpack gom chung các file javascript | npm run build |
Webpack source map | npm run build npm run build |
Webpack css loader | npm install --save-dev style-loader css-loader npm run build |
Webpack minify CSS - OptimizeCSSAssetsPlugin | npm install --save-dev mini-css-extract-plugin npm install --save-dev optimize-css-assets-webpack-plugin npm run build npm run build |