核心概念Entry/OutputLoader/Plugin对比Vite
Node.js版本npm/yarn/pnpmpackage.json目录结构
mode模式entry多入口output配置Hello World
css-loaderless/sassPostCSSCSS Modules
asset/resourceasset/inlineasset自动选择自定义文件名
@babel/preset-envbrowserslisttransform-runtimecore-js polyfill
ts-loader@babel/preset-typescripttsconfig.json声明文件
HtmlWebpackPluginejs/pug模板多页面压缩HTML
webpack-dev-serverHMRproxy代理historyApiFallback
devtool选项eval/cheap-source-map最佳实践安全性
SplitChunksPlugin动态importPreload/Prefetch
hash/chunkhash/contenthashruntime chunk长效缓存
DefinePluginprocess.envwebpack-merge多环境拆分
sideEffectsusedExportslodash-esminimize
image-webpack-loadersvg-sprite字体处理Base64内联
MiniCssExtractPluginCssMinimizerPurgeCSSCSSNano
Bundle AnalyzerSpeedMeasure构建耗时优化策略
多入口多出口HtmlWebpackPlugin多实例公共代码提取
同步/异步/raw/pitchLoader APIloader-utilsmarkdown-loader
Compiler/CompilationTapable钩子清除console插件
JSX/React Refreshvue-loaderVue3SSR
target:'node'externalsCSS/图片处理同构应用
持久化缓存模块联邦稳定化Top Level Awaitexperiments
Vite vs Webpackvite.config.js插件机制
import.meta.envCSS预处理Glob导入SSR
Rollup vs Webpackrollup.config.js插件生态
Lint-Staged/HuskyCommitlintCI/CD缓存Monorepo