npm run watch 错误无法读取“地图”未定义的属性答案

【问题标题】：npm run watch Error in Cannot read property of 'map' undefinednpm run watch 错误无法读取“地图”未定义的属性
【发布时间】：2020-12-15 20:52:19
【问题描述】：

问题：运行命令npm run watch 抛出错误

54% building 35/41 modules 6 active /app/docroot/themes/custom/mytheme/node_modules/css-loader/index.js??ref--10-2!/app/docroot/themes/custom/mytheme/node_modules/postcss-loader/src/index.js??postcss5!/app/docroot/themes
 ERROR  Failed to compile with 1 errors          1:25:50 AM

 error 

Cannot read property 'map' of undefined

 15 assets

ERROR in Cannot read property 'map' of undefined
[Browsersync] Proxying: https://ps.lndo.site

仅当以下代码包含在我的 webpack.mix.js 文件中时才会发生错误：

mix.imagemin({
  patterns: [{
    from: '**/*.{png,gif,jpg,jpeg,svg}',
    to: 'images/',
    context: 'src/images/'
  }, {
    from: '**/*.{png,gif,jpg,jpeg,svg}',
    to: 'images/',
    context: 'src/components/'
  }]
  });

删除上面的 sn-p 会删除错误，但是这个项目的以前的开发人员有这个原因。

由于安全漏洞，我最近进行了更新，并设法调试了 Copy Plugin 引入了重大更改（已在上面的代码中更新）的另一个问题。但是我不确定我的所有配置是否正确。

这个我试过了：从命令行

rm -rf node_modules
rm package.lock
npm cache clean --force
npm install

这些是 package.json 中截至 2020 年 8 月 27 日的当前包

"devDependencies": {
    "bootstrap": "^4.3.1",
    "browser-sync": "^2.26.12",
    "browser-sync-webpack-plugin": "^2.2.2",
    "copy-webpack-plugin": "^6.0.3",
    "cross-env": "^7.0.2",
    "husky": "^4.2.5",
    "imagemin-webpack-plugin": "^2.4.2",
    "jquery": "^3.5.1",
    "laravel-mix": "^5.0.4",
    "laravel-mix-imagemin": "^1.0.3",
    "popper.js": "^1.16.1",
    "pretty-quick": "^2.0.1",
    "resolve-url-loader": "^3.1.1",
    "sass": "^1.26.10",
    "sass-loader": "^8.0.2",
    "vue-template-compiler": "^2.6.11"
  },
"dependencies": {
    "throttle-debounce": "^2.3.0"
  }

更新的包如下

    "browser-sync": "^2.26.7",
    "copy-webpack-plugin": "^5.1.1",
    "husky": "^4.2.3",
    "jquery": "^3.5.0",
    "sass": "^1.26.3",

    "throttle-debounce": "^2.1.0"

【问题讨论】：

你更新了哪些软件包？
@AndySong 用包更新了我的问题。
我遇到了同样的问题，偶然发现了这个答案，它为我解决了这个问题。 stackoverflow.com/a/62480762/1862511

标签： npm webpack imagemin

【解决方案1】：

对我来说，这看起来像是 laravel-mix-imagemin 插件中的一个错误。它的 NPM 页面显示 "The patterns parameter is automatically converted to an array"。但这不符合您正在使用的copy-webpack-plugin^6（laravel-mix-imagemin 在后台使用），因为版本 6 不再接受数组。（太糟糕了 laravel-mix-imagemin 插件没有正确列出它的依赖项和它们的版本......）

顺便说一句：我遇到了基本相同的问题，您收到的错误消息是一场灾难。

【讨论】：

你拯救了我的夜晚！

【解决方案2】：

您可能对 webpack 的版本有疑问。这是我能做出的最好的猜测。如果此代码之前有效，那么这可能是一种可能性。

【讨论】：

【解决方案3】：

没有找到很好的答案，现在只是从 webpack mix 中删除了 imagemin 配置。修复了编译问题，但没有解决我原来的问题。

【讨论】：