Webpack 学习心得

Question

注意，命令行接口(Command Line Interface)参数的优先级，高于配置文件参数。例如，如果将 --mode="production" 传入 webpack CLI，而配置文件使用的是 development，最终会使用 production。

Webpack CLI 指南: https://webpack.docschina.org/api/cli

模块热（Hot Module Replacement）替换选择

在每次编译代码时，手动运行 npm run build 会显得很麻烦。webpack 提供几种可选方式，帮助你在代码发生变化后自动编译代码：

• webpack watch mode(webpack 观察模式，不建议)
• webpack-dev-server
• webpack-dev-middleware

选择其中一个开发工具

webpack-dev-server 配套设置

// webpack.config.js
module.exports = {
  devServer: {
    hot: true
  }
}

如果你在技术选型中使用了 webpack-dev-middleware 而没有使用 webpack-dev-server，请使用 webpack-hot-middleware package，以在你的自定义 server 或应用程序上启用 HMR。

webpack-dev-server 在内部使用了 webpack-dev-middleware