使用 webpack 部署到 Heroku 时预编译资产时出错

Question

我有一个项目最近升级到了 Rails 5.2，并且我正在使用 webpacker gem。我在尝试部署到 Heroku 时收到以下错误：

\n\n

...\nremote:        Webpacker is installed  \nremote:        Using /tmp/build_b969a2366f45a65a0c09b6aaa4b24667/config/webpacker.yml file for setting up webpack paths\nremote:        Compiling\xe2\x80\xa6\nremote:        Compilation failed:\nremote:        /tmp/build_b969a2366f45a65a0c09b6aaa4b24667/vendor/bundle/ruby/2.5.0/gems/webpacker-3.5.5/lib/webpacker/webpack_runner.rb:11:in `exec\': No such file or directory - /tmp/build_b969a2366f45a65a0c09b6aaa4b24667/node_modules/.bin/webpack (Errno::ENOENT)\nremote:         from /tmp/build_b969a2366f45a65a0c09b6aaa4b24667/vendor/bundle/ruby/2.5.0/gems/webpacker-3.5.5/lib/webpacker/webpack_runner.rb:11:in `block in run\'\nremote:         from /tmp/build_b969a2366f45a65a0c09b6aaa4b24667/vendor/bundle/ruby/2.5.0/gems/webpacker-3.5.5/lib/webpacker/webpack_runner.rb:10:in `chdir\'\nremote:         from /tmp/build_b969a2366f45a65a0c09b6aaa4b24667/vendor/bundle/ruby/2.5.0/gems/webpacker-3.5.5/lib/webpacker/webpack_runner.rb:10:in `run\'\nremote:         from /tmp/build_b969a2366f45a65a0c09b6aaa4b24667/vendor/bundle/ruby/2.5.0/gems/webpacker-3.5.5/lib/webpacker/runner.rb:6:in `run\'\nremote:         from ./bin/webpack:15:in `<main>\'\n...\n

\n\n

在本地，我的 \'node_modules\' 目录位于 .gitignore 中（我相信 webpacker 安装脚本之一将其放在那里）。

\n\n

我是否需要取消忽略node_modules，或者是否需要在配置文件中添加一些内容来告诉远程在哪里可以找到webpack？

\n\n

这是我的 package.json：

\n\n

{\n  "dependencies": {\n    "@rails/webpacker": "3.5.5",\n    "babel-preset-react": "^6.24.1",\n    "d3": "^5.7.0",\n    "jquery": "^3.3.1",\n    "prop-types": "^15.6.2",\n    "react": "^16.5.2",\n    "react-addons-transition-group": "^15.6.2",\n    "react-dom": "^16.5.2",\n    "react-transition-group": "^2.4.0",\n    "react_ujs": "^2.4.4"\n  },\n  "devDependencies": {\n    "webpack-dev-server": "2.11.2"\n  },\n  "engines": {\n    "yarn": "1.10.1"\n  } \n}\n

\n\n

我注意到 heroku 的输出提到使用 config/webpacker.yml 设置 webpacker 路径，但我在该文件中找不到任何提及在 node_modules 中查找 webpack 的内容 - 这是 webpacker.yml 的文本：

\n\n

# Note: You must restart bin/webpack-dev-server for changes to take effect\n\ndefault: &default\n  source_path: app/javascript\n  source_entry_path: packs\n  public_output_path: packs\n  cache_path: tmp/cache/webpacker\n\n  # Additional paths webpack should lookup modules\n  # [\'app/assets\', \'engine/foo/app/assets\']\n  resolved_paths: []\n\n  # Reload manifest.json on all requests so we reload latest compiled packs\n  cache_manifest: false\n\n  extensions:\n    - .jsx\n    - .js\n    - .sass\n    - .scss\n    - .css\n    - .module.sass\n    - .module.scss\n    - .module.css\n    - .png\n    - .svg\n    - .gif\n    - .jpeg\n    - .jpg\n\ndevelopment:\n  <<: *default\n  compile: true\n\n  # Reference: https://webpack.js.org/configuration/dev-server/\n  dev_server:\n    https: false\n    host: localhost\n    port: 3035\n    public: localhost:3035\n    hmr: false\n    # Inline should be set to true if using HMR\n    inline: true\n    overlay: true\n    compress: true\n    disable_host_check: true\n    use_local_ip: false\n    quiet: false\n    headers:\n      \'Access-Control-Allow-Origin\': \'*\'\n    watch_options:\n      ignored: /node_modules/\n\n\ntest:\n  <<: *default\n  compile: true\n\n  # Compile test packs to a separate directory\n  public_output_path: packs-test\n\nproduction:\n  <<: *default\n\n  # Production depends on precompilation of packs prior to booting for performance.\n  compile: false\n\n  # Cache manifest.json for performance\n  cache_manifest: true\n

\n\n

整个项目可以在github上找到

\n

Answer 1

/bin我最终通过使用以下命令重建目录解决了这个问题：

rails app:update:bin

我推断我一定损坏了该目录中的某些内容。我使用rails-jquery和rails-reactgems 启动了该项目，然后使用 webpacker 安装脚本来安装 jquery 和 React。我决定使用yarn add ...添加jquery和rails，这样我就可以使用yarn更紧密、一致地管理我的依赖项。