webpack5配置报Unresolved type EnvironmentPlugin错误如何解决

这是webpack 5启动时的配置schema校验报错，说明你通过module.exports导出的配置对象不符合webpack 5的合法配置规则，属于配置写法错误，没有特殊玄学原因。

绝大多数触发场景是以下几类问题：

• 配置层级写错：比如把loader规则直接写在module对象下，没有放到module.rules数组里；或是把应该放在对应rule里的enforce等字段提到了配置外层
• 字段名拼写/版本兼容错误：比如还在用webpack3时代的module.loaders写法（webpack4开始就废弃这个字段，统一用module.rules），或是把resolve.extensions、devtool等字段名拼错
• 配置值类型/格式错误：比如要求传绝对路径的output.path字段你传了相对路径'./dist'，要求传数组的plugins、resolve.extensions你传了对象/字符串，要求传插件实例的位置你直接传了插件类
• 多余的未知配置项：比如抄配置的时候多写了不存在的字段，或是把只在特定loader/plugin里支持的配置项写到了webpack外层配置里

1. 直接看报错日志里的详细提示，报错会精准标出出错的配置路径、期望的格式，比如提示configuration.output.path: The provided value "./dist" is not an absolute path!就直接定位到output.path修改即可，不用盲目排查
2. 对应常见错误修正配置：
   • 路径类错误统一用Node内置path模块生成绝对路径，参考写法：

   const path = require('path')
   module.exports = {
     output: {
       path: path.resolve(__dirname, 'dist'),
       filename: '[name].js'
     },
     // 其余配置
   }
   

   • loader配置严格遵循module.rules数组结构，每个规则对象包含test（匹配文件的正则）、use（用到的loader数组/字符串）等合法字段
   • plugins字段必须是数组，每一项是对应插件的new实例，不要直接传插件类
3. 如果你是照搬网上的老教程配置，先确认教程对应的webpack版本，webpack跨大版本的配置不通用，不要把webpack3/4的配置直接拿到webpack5里用。

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