进行打包分析
摘要：webpack.analysis.js const { merge } = require('webpack-merge') const commonConfig = require('./webpack.common') const { BundleAnalyzerPlugin } = requi
阅读全文
posted @ 2021-09-10 10:44
随笔分类 - Webpack
解析 JSX 语法
摘要：npx npm i -D @babel/preset-react webpack.config.js { "presets": [ [ "@babel/preset-env", { "targets": { "chrome": "90" }, "useBuiltIns": "usage" } ],
阅读全文
posted @ 2021-09-10 10:44
解决在 .scss 中 @import 其他 .scss 文件时可能出现的打包顺序执行异常
摘要：webpack.config.js module.exports = { module: { rules: [ { test: /\.(css|scss)$/, use: [ 'style-loader', { loader: 'css-loader', options: { importLoade
阅读全文
posted @ 2021-09-10 10:43
解决打包时 “TypeError this.getOptions is not a function” 报错
摘要：operate install lower version of target loader.
阅读全文
posted @ 2021-09-10 10:38
解决 Error Cannot find module 'webpack-clibinconfig-yargs' 报错
摘要：operate 保证 webpack-cli 和 webpack-dev-server 大版本号相同
阅读全文
posted @ 2021-09-10 10:37
解除 Tree Shaking 的副作用
摘要：// sideEffects 的用法
阅读全文
posted @ 2021-09-10 10:17
将图片打包到专门存放图片的 images 目录下
摘要：webpack.config.js const { resolve } = require('path') module.exports = { module: { rules: [ { test: /\.png$/, use: { loader: 'file-loader', options: {
阅读全文
posted @ 2021-09-10 10:13
将图片文件打包成 Base64
摘要：npm npm i -D url-loader webpack.config.js module.exports = { // ... module: { rules: [ { test: /\.png$/, use: 'url-loader', }, ], }, }
阅读全文
posted @ 2021-09-10 10:13
webpack 对 development 和 production 进行区分打包
摘要：./build - build - webpack.common.js - webpack.dev.js - webpack.prod.js webpack.common.js module.exports = { entry: output: plugins: module: ... } webp
阅读全文
posted @ 2021-09-09 10:52
webpack 打包 .scss 样式文件
摘要：npm npm i -D sass-loader node-sass webpack.config.js module.exports = { // ... module: { rules: [ { test: /\.(css|scss)$/, use: ['style-loader', 'css-
阅读全文
posted @ 2021-09-09 10:38
webpack 打包图片文件
摘要：npm npm i -D file-loader webpack.config.js module.exports = { module: { rules: [ { test: /\.(png|jpg|gif|jpeg)$/, use: { loader: 'file-loader', }, },
阅读全文
posted @ 2021-09-09 10:38
webpack 打包 css 文件
摘要：npm npm i -D style-loader css.loader webpack.config.js module.exports = { // ... module: { rules: [ { test: /\.css$/, use: ['style-loader', 'css-loade
阅读全文
posted @ 2021-09-09 10:37
不用 devServer 就实现文件发生变动时就重新打包
摘要：webpack.config.js module.exports = { entry: { main: './src/index.js', }, } package.json { "scripts": { "watch": "webpack --watch" }, }
阅读全文
posted @ 2021-09-09 10:25
