Webpack 开发服务器如何使用构建目录中没有文件的包？

Question

我注意到，当我运行 webpack 我的所有捆绑文件都在构建目录中，但是当我运行 webpack-dev-server 我没有看到它们在构建目录中，但都是运行ning。

WDS 如何做到这一点？有我的脚本：

  "scripts": {
    "build": "npx yarn clean && webpack --mode production",
    "buildRemote": "npx yarn clean && webpack --config webpack.config.remote.js",
    "clean": "rm -rf build",
    "watch": "webpack-dev-server --quite --no-info"
  },

谢谢！

Answer 1

这里的区别在于每个方法如何处理 webpack 生成的资产。

当您运行 webpack 命令时，所有内容都将通过 fs 模块转到声明的 output.path。换句话说，生成的资产被写入磁盘。

现在，当您运行 webpack-dev-server, under the hood webpack-dev-middleware kicks in. This is an express middleware that serves webpack's generated assets. Under the hood, it uses memory-fs 时，顾名思义，这是一个文件系统模块，可以处理内存中保存的 javascript 个对象中的所有内容。

Webpack 开发服务器如何使用构建目录中没有文件的包？

How does Webpack dev server consume bundle without file in build directory?

webpack

webpack-dev-server