“`babel在生产中”`rake资产:预编译“时加载器`依赖错误

Question

我继承了一个Rails应用程序，并试图让它在production中手动构建

应用程序使用

• webpacker-3.5.5红宝石管理JavaScript assets
• webpack v3.12.0
• sprockets gem管理传统的CSS /图像资产

作为webpacker配置的一部分，它特别在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，它定义了包的安装：

{
  "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，则在devDependencies.\中设置babel-loader。

解决方案是什么？将babel-loader移动到dependencies