Webpack 构建失败并出现 EPIPE 错误（仅限 Linux 子系统）

Question

我有一个项目，如果我使用已安装的节点/纱线的 Windows 版本从命令行运行 Webpack，则可以正常编译。但是，当我第二次尝试从 Linux 子系统进行 Webpack 构建时，它会出现以下错误：

events.js:167
      throw er; // Unhandled 'error' event
      ^

Error: write EPIPE
    at WriteWrap.afterWrite [as oncomplete] (net.js:788:14)
Emitted 'error' event at:
    at onwriteError (_stream_writable.js:431:12)
    at onwrite (_stream_writable.js:456:5)
    at _destroy (internal/streams/destroy.js:40:7)
    at Socket._destroy (net.js:613:3)
    at Socket.destroy (internal/streams/destroy.js:32:8)
    at WriteWrap.afterWrite [as oncomplete] (net.js:790:10)
error Command failed with exit code 1.

注意：当我在 Linux 和 Windows 上分别尝试时，我确实清除了 node_modules 并重新下载了依赖项。

目前，这是唯一存在此问题的项目，我的所有其他项目都工作正常。

这是我的依赖项：

  "dependencies": {
    "@date-io/date-fns": "0.0.2",
    "@firebase/app": "^0.3.5",
    "@firebase/auth": "^0.9.0",
    "@firebase/firestore": "^0.9.0",
    "@firebase/storage": "^0.2.4",
    "@material-ui/core": "^3.6.1",
    "@material-ui/icons": "^3.0.1",
    "classnames": "^2.2.6",
    "date-fns": "^2.0.0-alpha.21",
    "isomorphic-fetch": "^2.2.1",
    "material-ui-pickers": "^2.0.4",
    "react": "^16.6.3",
    "react-async-script": "^1.0.0",
    "react-dom": "^16.6.3",
    "react-dropzone": "^7.0.1",
    "react-redux": "^6.0.0",
    "react-router": "^4.3.1",
    "react-router-dom": "^4.3.1",
    "redux": "^4.0.1",
    "redux-actions": "^2.6.4",
    "redux-saga": "^0.16.2",
    "reselect": "^4.0.0"
  },
  "devDependencies": {
    "@babel/core": "^7.2.0",
    "@babel/plugin-proposal-class-properties": "^7.2.1",
    "@babel/preset-env": "^7.2.0",
    "@babel/preset-react": "^7.0.0",
    "@babel/preset-typescript": "^7.1.0",
    "@types/googlemaps": "^3.30.16",
    "@types/node": "^10.12.12",
    "@types/react": "^16.7.13",
    "@types/react-dom": "^16.0.11",
    "@types/react-redux": "^6.0.10",
    "@types/react-router": "^4.4.1",
    "@types/react-router-dom": "^4.3.1",
    "@types/redux-actions": "^2.3.1",
    "@types/webpack": "^4.4.20",
    "babel-loader": "^8.0.4",
    "babel-polyfill": "^6.26.0",
    "css-loader": "^1.0.1",
    "extract-text-webpack-plugin": "^4.0.0-beta.0",
    "favicons-webpack-plugin": "^0.0.9",
    "file-loader": "^2.0.0",
    "html-webpack-plugin": "^3.2.0",
    "image-webpack-loader": "^4.6.0",
    "node-sass": "^4.10.0",
    "path": "^0.12.7",
    "react-svg-loader": "^2.1.0",
    "resolve-url-loader": "^3.0.0",
    "sass-loader": "^7.1.0",
    "source-map-loader": "^0.2.4",
    "style-loader": "^0.23.1",
    "ts-loader": "^5.3.1",
    "tslib": "^1.9.3",
    "tslint": "^5.11.0",
    "tslint-react": "^3.6.0",
    "typescript": "^3.2.2",
    "url-loader": "^1.1.2",
    "webpack": "^4.27.1",
    "webpack-cli": "^3.1.2"
  }

Answer 1

根据这个GitHub 问题，问题出在image-webpack-loader，该线程中有多种解决方案：

最流行的解决方案：

这显然是 imagemin-mozjpeg 的问题。根据此评论 imagemin/imagemin-mozjpeg#28 (comment) 您需要安装 libpng16-dev (sudo apt-get install libpng16-dev)。

这在 Ubuntu 16.04.1 LTS 上为我解决了这个问题

还有这个

将 image-webpack-loader 更新到版本 4.5.0 解决了这个问题

和这个：

降级到 3.6.0 效果很好。一切都在 Netlify 和 Ubuntu 16.04 上构建得很好。

注意：旁注，favicons-webpack-plugin也导致了同样的问题。（来自@w9jds的评论）