在使用webpack部署到Heroku时,出现了预编译资源错误。

5
我有一个项目,最近已经升级到Rails 5.2,并且我正在使用Webpacker gem。尝试部署到Heroku时,我遇到了以下错误:
...
remote:        Webpacker is installed  
remote:        Using /tmp/build_b969a2366f45a65a0c09b6aaa4b24667/config/webpacker.yml file for setting up webpack paths
remote:        Compiling…
remote:        Compilation failed:
remote:        /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)
remote:         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'
remote:         from /tmp/build_b969a2366f45a65a0c09b6aaa4b24667/vendor/bundle/ruby/2.5.0/gems/webpacker-3.5.5/lib/webpacker/webpack_runner.rb:10:in `chdir'
remote:         from /tmp/build_b969a2366f45a65a0c09b6aaa4b24667/vendor/bundle/ruby/2.5.0/gems/webpacker-3.5.5/lib/webpacker/webpack_runner.rb:10:in `run'
remote:         from /tmp/build_b969a2366f45a65a0c09b6aaa4b24667/vendor/bundle/ruby/2.5.0/gems/webpacker-3.5.5/lib/webpacker/runner.rb:6:in `run'
remote:         from ./bin/webpack:15:in `<main>'
...

本地我的“node_modules”目录在.gitignore中(我相信webpacker的一个安装脚本把它放在那里)。

我需要取消忽略node_modules,还是需要在配置文件中添加一些内容来告诉远程服务器如何找到webpack?

这是我的package.json:

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

我注意到Heroku的输出提到了使用config/webpacker.yml设置webpack路径,但我在该文件中找不到任何关于在node_modules中查找webpack的提及 - 这是webpacker.yml的文本:
# Note: You must restart bin/webpack-dev-server for changes to take effect

default: &default
  source_path: app/javascript
  source_entry_path: packs
  public_output_path: packs
  cache_path: tmp/cache/webpacker

  # Additional paths webpack should lookup modules
  # ['app/assets', 'engine/foo/app/assets']
  resolved_paths: []

  # Reload manifest.json on all requests so we reload latest compiled packs
  cache_manifest: false

  extensions:
    - .jsx
    - .js
    - .sass
    - .scss
    - .css
    - .module.sass
    - .module.scss
    - .module.css
    - .png
    - .svg
    - .gif
    - .jpeg
    - .jpg

development:
  <<: *default
  compile: true

  # Reference: https://webpack.js.org/configuration/dev-server/
  dev_server:
    https: false
    host: localhost
    port: 3035
    public: localhost:3035
    hmr: false
    # Inline should be set to true if using HMR
    inline: true
    overlay: true
    compress: true
    disable_host_check: true
    use_local_ip: false
    quiet: false
    headers:
      'Access-Control-Allow-Origin': '*'
    watch_options:
      ignored: /node_modules/


test:
  <<: *default
  compile: true

  # Compile test packs to a separate directory
  public_output_path: packs-test

production:
  <<: *default

  # Production depends on precompilation of packs prior to booting for performance.
  compile: false

  # Cache manifest.json for performance
  cache_manifest: true

整个项目可以在GitHub上找到。

1
你的 package.json 文件中是否有 webpack 作为依赖项? - sdgluck
@sdgluck 我的依赖项中有 @rails/webpacker,但没有 webpacker。我已更新问题,包括 package.json 的文本。 - Fred Willmore
我的意思是我有 @rails/webpacker 但没有 webpack - Fred Willmore
3个回答

1

我最终通过以下方式重新构建了/bin目录,解决了这个问题:

rails app:update:bin

我推断我一定是在那个目录里弄坏了什么东西。我使用了 rails-jqueryrails-react 宝石来开始这个项目,然后使用 webpacker 安装脚本来安装 jquery 和 react。我决定使用 yarn add ... 来添加 jquery 和 rails,以便更紧密、一致地管理我的依赖关系。

太棒了,你的回答非常好!这也是对我有用的!谢谢! - Gustavo Marques

1
我有一系列问题,这些问题仅仅是从上述错误开始的。
它让我在网络上进行了一次复杂的旅程。我希望这些想法能够帮助其他人。
以下是我所做的:
1. 确保在Heroku上设置了Node Buildpack(我还没有弄清楚为什么过去不需要这样做,突然之间现在需要了,但这是另一个时间的事情)。
heroku buildpacks:add --index 1 heroku/nodejs

2.

注意:我不确定这一步是否真的必要,因为在一切都正常工作后,我删除了环境变量,它仍然可以正常工作。因此,我怀疑您可以跳过这一步。但请注意,其他人报告说对他们有效,所以值得一试。

在Heroku上设置这些环境变量。

heroku config:set NPM_CONFIG_PRODUCTION=false YARN_PRODUCTION=false
# Note: you can unset them with 
# heroku config:unset NPM_CONFIG_PRODUCTION YARN_PRODUCTION
# If you decide you don't want them

3.

有进展了,但现在我收到了这个错误信息

configuration.node should be one of these: false | object { __dirname?, __filename?, global? }

这是英文文本,翻译如下:

这是因为

Rails的webpacker 5.x.x仅与webpack 4.x.x兼容(https://github.com/rails/webpacker/tree/5-x-stable)。您可能希望降级到webpack 4 :)

因此,我只需运行yarn add webpack@4.46.0即可添加webpack最新的4.x.x版本


然后,最终,推送到Heroku成功了!

1
什么时候不是漫长而曲折的旅程呢? - ToddT

0

我能够在本地机器上使用yarn 1.10.1预编译您的资产。Heroku可能使用较旧版本的yarn,这可能会导致webpacker 3出现一些问题。

因此,请尝试升级到最新版本的yarn,然后在本地机器上运行以下命令:

# reinstall the node_modules
yarn install

# this is what heroku does to precompile your assets
bundle exec rake assets:precompile

这应该会更新你的 yarn.lock 文件。如果一切正常,那么尝试再次进行 git 提交和推送。

希望这样可以解决问题。祝好运。


1
谢谢您的回答@stephenmurdoch - 我已经尝试了,但我的结果仍然是一样的。远程地运行时,webpack_runner似乎在尝试运行node_modules/.bin/webpack,但找不到该文件。我认为这是因为我的node_modules目录在.gitignore中。但是,我认为该目录应该在.gitignore中。这些节点模块不属于我的git仓库。我已更新我的问题,包括更新的package.json和更多的错误文本。 - Fred Willmore
是的,你的node模块文件夹肯定应该在.gitignore中。我从我的package.json中删除了"engines"部分,因为它在Heroku上引起了麻烦,当我这样做时,一切都正常工作。 - stephenmurdoch

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接