如何在Webpack Encore中配置writeToDisk及非dev server schema定义的选项

正确配置方案 #

你遇到的报错是因为webpack-dev-server v4+ 已经将writeToDisk配置项从顶层移动到了devMiddleware属性下，而Symfony Webpack Encore默认不会预初始化devMiddleware对象，直接赋值就会触发undefined错误，正确配置方式如下：

Encore.configureDevServerOptions(options => {
    // 先初始化devMiddleware对象，避免未定义报错
    options.devMiddleware = options.devMiddleware || {};
    // 配置writeToDisk，值可以是布尔值或者筛选文件的函数
    options.devMiddleware.writeToDisk = true;
});

附带告警的处理说明 #

• webpack重复依赖告警：如果你手动安装webpack@^5.35是为了规避其他依赖冲突，且实际运行没有功能异常，可以直接忽略该告警；如果要消除告警，删除package.json中自行添加的webpack依赖即可，直接使用Encore内置的webpack版本。
• publicPath告警：如果你的生产环境必须配置绝对路径publicPath，可以通过环境判断动态配置来避免dev模式下触发告警：

if (Encore.isDevServer()) {
    // 开发模式使用相对路径
    Encore.setPublicPath('/build');
} else {
    // 生产模式使用绝对路径
    Encore.setPublicPath('http://localhost:9091/build/');
}

未在dev server schema中定义的选项配置规则 #

首先需要确认你使用的webpack-dev-server版本对应的官方配置schema，webpack-dev-server v4版本对配置结构做了大范围调整，很多旧版本的顶层配置项都被归类到了不同的子属性下：

• 静态资源服务相关配置移到static属性下
• 开发中间件相关配置移到devMiddleware属性下
• 客户端热更相关配置移到client属性下
• 代理相关配置移到proxy属性下
  所有符合当前版本schema的配置项，都可以通过configureDevServerOptions回调，先初始化对应子属性再赋值的方式完成配置，不会触发报错。

内容的提问来源于stack exchange，提问作者TropicalRaisel