`rake assets:precompile` 在生產中時出現`babel-loader` 依賴錯誤

Question

我繼承了一個 Rails 應用程序，我正試圖讓它在production中手動構建

該應用程序使用

• webpacker-3.5.5 ruby gem 來管理 JavaScript 資產
• webpack v3.12.0
• sprockets gem 來管理傳統的 CSS / 圖像資產

作為 webpacker gem 配置的一部分，它特別在 JSX/React 資產上使用babel-loader 。 我不太確定這是做什么的，但我猜它是某種預處理器？

module.exports = {
  test: /\.jsx?$/,
  exclude: /node_modules/,
  use: [{
    loader: "babel-loader",
    options: {
      cacheDirectory: true,
      // Use .babelrc - not webpack config JS - to define all options
      babelrc: true
    }
  }]
}

當我嘗試在生產服務器上運行rake assets:precompile時，它在嘗試使用webpack構建資產的步驟中出錯

> rake assets:precompile
yarn install v1.17.3
warning package.json: No license field
warning delly@1.0.0: No license field
[1/4] Resolving packages...
success Already up-to-date.
Done in 1.18s.
Webpacker is installed 🎉 🍰
Using /app/config/webpacker.yml file for setting up webpack paths
Compiling…
Compilation failed:

Hash: 27785324c8b2ba6004dd
Version: webpack 3.12.0
Time: 119ms
        Asset     Size  Chunks             Chunk Names
manifest.json  2 bytes          [emitted]

ERROR in Entry module not found: Error: Can't resolve 'babel-loader' in '/app'

ERROR in Entry module not found: Error: Can't resolve 'babel-loader' in '/app'

這不會發生在本地development中，只會發生在production中。

知道為什么這會出錯嗎？ 生產中是否需要babel-loader或者我可以將其完全從生產中刪除？

這是我的package.json ，它定義了 package 的安裝：

{
  "name": "delly",
  "version": "1.0.0",
  "scripts": {
    "test": "node_modules/.bin/jest --no-cache --config spec/javascript/jest.config.js",
    "test:debug": "node --inspect-brk node_modules/.bin/jest --no-cache --config spec/javascript/jest.config.js --colors --verbose"
  },
  "devDependencies": {
    "@babel/cli": "^7.4.4",
    "@babel/core": "^7.4.5",
    "@babel/plugin-proposal-class-properties": "^7.4.4",
    "@babel/plugin-proposal-object-rest-spread": "^7.4.4",
    "@babel/plugin-syntax-dynamic-import": "^7.2.0",
    "@babel/plugin-transform-modules-commonjs": "^7.4.4",
    "@babel/preset-env": "^7.4.5",
    "@babel/preset-react": "^7.0.0",
    "babel-core": "^7.0.0-bridge.0",
    "babel-eslint": "^10.0.1",
    "babel-jest": "^24.8.0",
    "babel-loader": "^8.0.6",
    "babel-plugin-module-resolver": "^3.2.0",
    "eslint": "^4.6.1",
    "eslint-plugin-jsx-a11y": "^6.0.3",
    "eslint-plugin-react": "^7.6.1",
    "i18n-js": "^3.2.2",
    "jest": "^24.8.0",
    "jest-dom": "^3.4.0",
    "js-yaml": "^3.13.1",
    "react-testing-library": "^7.0.1",
    "stylelint": "^9.3.0",
    "stylelint-config-rational-order": "^0.0.2",
    "webpack-dev-server": "2.11.2"
  },
  "dependencies": {
    "@rails/webpacker": "^3.5.5",
    "axios": "^0.19.0",
    "core-js": "3",
    "html-react-parser": "^0.4.6",
    "jquery": "^3.3.1",
    "jquery-ujs": "^1.2.2",
    "prop-types": "^15.6.1",
    "rails-erb-loader": "^5.4.1",
    "react": "^16.0.0",
    "react-dom": "^16.0.0",
    "react-on-rails": "^11.3.0",
    "react-toggle-switch": "^3.0.4",
    "react-transition-group": "1.x",
    "react_ujs": "^2.4.4"
  }
}

一個

Answer 1

當您在生產模式下運行rake assets:precompile時，它也會在生產模式下運行webpack ，在這種情況下，僅加載dependencies項中設置的包，如果您查看packages.json ， babel-loader設置在devDependencies中。\

解決方案？ 將babel-loader移至dependencies項