無法在 Heroku 上使用 Webpacker 部署 Rails 應用程序

Question

我已將 Rails 5 應用程序升級到 Rails 6，並將所有 JS 文件從資產管道遷移到 Webpacker。 在開發中一切正常。 但是，當我將代碼推送到生產環境時，嘗試加載頁面時會出現錯誤。

我正在使用 heroku 進行生產。 構建過程成功完成。

這是我的錯誤：

ActionView::Template::Error (Webpacker can't find application in /app/public/packs/manifest.json. 
Possible causes:
2019-10-24T07:23:04.376725+00:00 app[web.2]: 1. You want to set webpacker.yml value of compile to true for your environment
2019-10-24T07:23:04.376728+00:00 app[web.2]: unless you are using the `webpack -w` or the webpack-dev-server.
2019-10-24T07:23:04.376730+00:00 app[web.2]: 2. webpack has not yet re-run to reflect updates.
2019-10-24T07:23:04.376732+00:00 app[web.2]: 3. You have misconfigured Webpacker's config/webpacker.yml file.
2019-10-24T07:23:04.376734+00:00 app[web.2]: 4. Your webpack configuration is not creating a manifest.
2019-10-24T07:23:04.376736+00:00 app[web.2]: Your manifest contains:
2019-10-24T07:23:04.376739+00:00 app[web.2]: {
2019-10-24T07:23:04.376741+00:00 app[web.2]: }
2019-10-24T07:23:04.376742+00:00 app[web.2]: ):

這是我的 package.json 文件

{
  "name": "manager",
  "private": true,
  "dependencies": {
    "@rails/activestorage": "^6.0.0",
    "@rails/ujs": "^6.0.0",
    "@rails/webpacker": "^4.0.7",
    "bootstrap": "^4.3.1",
    "fullcalendar": "^3.10.1",
    "jquery": "^3.4.1",
    "jquery-ui": "^1.12.1",
    "latest-version": "^5.1.0",
    "moment": "^2.24.0",
    "popper.js": "^1.16.0",
    "qtip2": "^3.0.3",
    "scheduler": "^0.16.2",
    "tempusdominus-bootstrap-4": "^5.1.2"
  },
  "devDependencies": {
    "webpack-dev-server": "^3.8.2"
  }
}

我完全迷路了。 我嘗試重新編譯資產，將 webpacker compile更改為true以進行生產。 我也嘗試過運行yarn install --check-files但一切都運行成功。 我還嘗試使用以下命令完全重新安裝 webpacker： bundle exec rake webpacker:install然后將更新的代碼推送到生產環境，但我仍然遇到同樣的錯誤。

這是我的 heroku 構建日志

Delta compression using up to 2 threads.
Compressing objects: 100% (7/7), done.
Writing objects: 100% (7/7), 1.01 KiB | 1.01 MiB/s, done.
Total 7 (delta 6), reused 0 (delta 0)
remote: Compressing source files... done.
remote: Building source:
remote: 
remote: -----> Node.js app detected
remote:        
remote: -----> Creating runtime environment
remote:        
remote:        NPM_CONFIG_LOGLEVEL=error
remote:        NODE_ENV=production
remote:        NODE_MODULES_CACHE=true
remote:        NODE_VERBOSE=false
remote:        
remote: -----> Installing binaries
remote:        engines.node (package.json):  unspecified
remote:        engines.npm (package.json):   unspecified (use default)
remote:        engines.yarn (package.json):  unspecified (use default)
remote:        
remote:        Resolving node version 10.x...
remote:        Downloading and installing node 10.17.0...
remote:        Using default npm version: 6.11.3
remote:        Resolving yarn version 1.x...
remote:        Downloading and installing yarn (1.19.1)...
remote:        Installed yarn 1.19.1
remote:        
remote: -----> Restoring cache
remote:        - node_modules
remote:        
remote: -----> Installing dependencies
 remote:        Installing node modules (yarn.lock)
remote:        yarn install v1.19.1
remote:        [1/4] Resolving packages...
remote:        [2/4] Fetching packages...
 remote:        info fsevents@1.2.9: The platform "linux" is incompatible with this module.
remote:        info "fsevents@1.2.9" is an optional dependency and failed compatibility check. Excluding it from installation.
remote:        [3/4] Linking dependencies...
remote:        warning " > tempusdominus-bootstrap-4@5.1.2" has unmet peer dependency "moment-timezone@^0.5.11".
remote:        warning " > tempusdominus-bootstrap-4@5.1.2" has unmet peer dependency "tempusdominus-core@5.0.3".
remote:        warning " > webpack-dev-server@3.9.0" has unmet peer dependency "webpack@^4.0.0".
remote:        warning "webpack-dev-server > webpack-dev-middleware@3.7.2" has unmet peer dependency "webpack@^4.0.0".
remote:        [4/4] Building fresh packages...
remote:        Done in 27.57s.
 remote:        
remote: -----> Build
remote:        
remote: -----> Pruning devDependencies
remote:        yarn install v1.19.1
remote:        [1/4] Resolving packages...
remote:        [2/4] Fetching packages...
remote:        info fsevents@1.2.9: The platform "linux" is incompatible with this module.
remote:        info "fsevents@1.2.9" is an optional dependency and failed compatibility check. Excluding it from installation.
 remote:        [3/4] Linking dependencies...
remote:        warning " > tempusdominus-bootstrap-4@5.1.2" has unmet peer 
dependency "moment-timezone@^0.5.11".
remote:        warning " > tempusdominus-bootstrap-4@5.1.2" has unmet peer 
dependency "tempusdominus-core@5.0.3".
remote:        warning " > webpack-dev-server@3.9.0" has unmet peer 
dependency "webpack@^4.0.0".
remote:        warning "webpack-dev-server > webpack-dev-middleware@3.7.2" 
has unmet peer dependency "webpack@^4.0.0".
remote:        [4/4] Building fresh packages...
remote:        warning Ignored scripts due to flag.
remote:        Done in 5.14s.
remote:        
remote: -----> Caching build
remote:        - node_modules
remote:        
remote: -----> Build succeeded!
remote:  !     This app may not specify any way to start a node process
remote:        https://devcenter.heroku.com/articles/nodejs-support#default- 
web-process-type
 remote: 
remote:  !     Unmet dependencies don't fail yarn install but may cause 
runtime issues
remote:        https://github.com/npm/npm/issues/7494
remote: 
remote: -----> Ruby app detected
remote: -----> Compiling Ruby/Rails
remote: -----> Using Ruby version: ruby-2.5.3
remote: -----> Installing dependencies using bundler 1.17.3
remote:        Running: bundle install --without development:test --path 
vendor/bundle --binstubs vendor/bundle/bin -j4 --deployment
remote:        The dependency tzinfo-data (>= 0) will be unused by any of 
the platforms Bundler is installing for. Bundler is installing for ruby but 
the dependency is only for x86-mingw32, x86-mswin32, x64-mingw32, java. To 
add those platforms to the bundle, run 'bundle lock --add-platform x86- 
mingw32 x86-mswin32 x64-mingw32 java'.
remote:        Using rake 13.0.0
remote:        Using concurrent-ruby 1.1.5
remote:        Using i18n 1.7.0
remote:        Using minitest 5.12.2
remote:        Using thread_safe 0.3.6
remote:        Using tzinfo 1.2.5
remote:        Using zeitwerk 2.2.0
remote:        Using activesupport 6.0.0
remote:        Using builder 3.2.3
remote:        Using erubi 1.9.0
remote:        Using mini_portile2 2.4.0
remote:        Using nokogiri 1.10.4
remote:        Using rails-dom-testing 2.0.3
remote:        Using crass 1.0.4
remote:        Using loofah 2.3.0
remote:        Using rails-html-sanitizer 1.3.0
remote:        Using actionview 6.0.0
remote:        Using rack 2.0.7
remote:        Using rack-test 1.1.0
remote:        Using actionpack 6.0.0
remote:        Using nio4r 2.5.2
remote:        Using websocket-extensions 0.1.4
remote:        Using websocket-driver 0.7.1
remote:        Using actioncable 6.0.0
remote:        Using globalid 0.4.2
remote:        Using activejob 6.0.0
remote:        Using activemodel 6.0.0
remote:        Using activerecord 6.0.0
remote:        Using mimemagic 0.3.3
remote:        Using marcel 0.3.3
remote:        Using activestorage 6.0.0
remote:        Using mini_mime 1.0.2
remote:        Using mail 2.7.1
remote:        Using actionmailbox 6.0.0
remote:        Using actionmailer 6.0.0
remote:        Using actiontext 6.0.0
remote:        Using public_suffix 4.0.1
remote:        Using addressable 2.7.0
remote:        Using encryptor 3.0.0
remote:        Using attr_encrypted 3.1.0
remote:        Using execjs 2.7.0
remote:        Using autoprefixer-rails 9.6.4
remote:        Using aws-eventstream 1.0.3
remote:        Using aws-partitions 1.222.0
remote:        Using aws-sigv4 1.1.0
remote:        Using jmespath 1.4.0
remote:        Using aws-sdk-core 3.68.1
remote:        Using aws-sdk-polly 1.26.0
remote:        Using bcrypt 3.1.13
remote:        Using msgpack 1.3.1
remote:        Using bootsnap 1.4.5
remote:        Using popper_js 1.14.5
remote:        Using rb-fsevent 0.10.3
remote:        Using ffi 1.11.1
remote:        Using rb-inotify 0.10.0
remote:        Using sass-listen 4.0.0
remote:        Using sass 3.7.4
remote:        Using bootstrap 4.0.0
remote:        Using method_source 0.9.2
remote:        Using thor 0.20.3
remote:        Using railties 6.0.0
remote:        Using jquery-rails 4.3.5
remote:        Using momentjs-rails 2.20.1
remote:        Using moment-timezone-rails 1.0.0
remote:        Using bootstrap4-datetime-picker-rails 0.3.1
remote:        Using bundler 1.17.3
remote:        Using mini_magick 4.9.5
remote:        Using ruby-vips 2.0.15
remote:        Using image_processing 1.9.3
remote:        Using carrierwave 2.0.2
remote:        Using coffee-script-source 1.12.2
remote:        Using coffee-script 2.4.1
remote:        Using coffee-rails 5.0.0
remote:        Using orm_adapter 0.5.0
remote:        Using responders 3.0.0
remote:        Using warden 1.2.8
remote:        Using devise 4.7.1
remote:        Using multi_json 1.13.1
remote:        Using elasticsearch-api 7.3.0
remote:        Using multipart-post 2.1.1
remote:        Using faraday 0.17.0
remote:        Using elasticsearch-transport 7.3.0
remote:        Using elasticsearch 7.3.0
remote:        Using hashie 3.6.0
remote:        Using elasticsearch-model 7.0.0
remote:        Using elasticsearch-rails 7.0.0
remote:        Using excon 0.67.0
remote:        Using formatador 0.2.5
remote:        Using mime-types-data 3.2019.1009
remote:        Using mime-types 3.3
remote:        Using fog-core 2.1.2
remote:        Using fog-json 1.2.0
remote:        Using fog-xml 0.1.3
remote:        Using ipaddress 0.8.3
remote:        Using fog-aws 3.5.2
remote:        Using jquery-ui-rails 6.0.1
remote:        Using fullcalendar-rails 3.9.0.0
remote:        Using hkdf 0.3.0
remote:        Using jbuilder 2.9.1
remote:        Using jwt 2.2.1
remote:        Using kaminari-core 1.1.1
remote:        Using kaminari-actionview 1.1.1
remote:        Using kaminari-activerecord 1.1.1
remote:        Using kaminari 1.1.1
remote:        Using libv8 7.3.492.27.1 (x86_64-linux)
remote:        Using mini_racer 0.2.6
remote:        Using multi_xml 0.6.0
remote:        Using oauth 0.4.7
remote:        Using oauth2 1.4.2
remote:        Using pg 1.1.4
remote:        Using pr_geohash 1.0.0
remote:        Using puma 4.2.1
remote:        Using roxml 4.0.0
remote:        Using quickbooks-ruby 1.0.0
remote:        Using rack-proxy 0.6.5
remote:        Using sprockets 4.0.0
remote:        Using sprockets-rails 3.2.1
remote:        Using rails 6.0.0
remote:        Using rsolr 2.2.1
remote:        Using ruby_http_client 3.3.0
remote:        Using sassc 2.2.1
remote:        Using tilt 2.0.10
remote:        Using sassc-rails 2.1.2
remote:        Using sass-rails 6.0.0
remote:        Using sendgrid-ruby 6.0.0
remote:        Using stripe 5.7.0
remote:        Using sunspot 2.5.0
remote:        Using sunspot_rails 2.5.0
remote:        Using sunspot_solr 2.5.0
remote:        Using twilio-ruby 5.27.1
remote:        Using uglifier 4.2.0
remote:        Using webpacker 4.0.7
remote:        Using webpush 1.0.0
remote:        Using wicked_pdf 1.4.0
remote:        Using wkhtmltopdf-binary 0.12.4
remote:        Bundle complete! 42 Gemfile dependencies, 135 gems now installed.
remote:        Gems in the groups development and test were not installed.
remote:        Bundled gems are installed into './vendor/bundle'
remote:        Bundle completed (0.54s)
remote:        Cleaning up the bundler cache.
remote:        The dependency tzinfo-data (>= 0) will be unused by any of 
the platforms Bundler is installing for. Bundler is installing for ruby but 
the 
 dependency is only for x86-mingw32, x86-mswin32, x64-mingw32, java. To add 
those platforms to the bundle, run 'bundle lock --add-platform x86-mingw32 
x86-mswin32 x64-mingw32 java'.
remote:        Detected manifest file, assuming assets were compiled locally
remote: -----> Detecting rails configuration
remote: -----> Detecting rake tasks
remote: 
remote: ###### WARNING:
remote: 
remote:        Detecting rails configuration failed
remote:        set HEROKU_DEBUG_RAILS_RUNNER=1 to debug
remote: 
remote: 
remote: ###### WARNING:
remote: 
remote:        We detected that some binary dependencies required to
remote:        use all the preview features of Active Storage are not
remote:        present on this system.
remote:        
remote:        For more information please see:
remote:          https://devcenter.heroku.com/articles/active-storage-on- 
heroku
remote:        
remote: 
remote: 
remote: ###### WARNING:
remote: 
remote:        There is a more recent Ruby version available for you to use:
remote:        
remote:        2.5.7
remote:        
remote:        The latest version will include security and bug fixes, we always recommend
remote:        running the latest version of your minor release.
remote:        
remote:        Please upgrade your Ruby version.
remote:        
remote:        For all available Ruby versions see:
remote:          https://devcenter.heroku.com/articles/ruby-support#supported-runtimes
remote: 
remote: 
remote: ###### WARNING:
remote: 
remote:        No Procfile detected, using the default web server.
remote:        We recommend explicitly declaring how to boot your server process via a Procfile.
remote:        https://devcenter.heroku.com/articles/ruby-default-web-server
remote: 
remote: 
remote: 
remote: -----> Discovering process types
remote:        Procfile declares types     -> (none)
remote:        Default types for buildpack -> console, rake, web
remote: 
remote: -----> Compressing...
remote:        Done: 218M
remote: -----> Launching...
remote:        Released v573
remote:        https://enigmatic-temple-38800.herokuapp.com/ deployed to Heroku
remote: 
remote: Verifying deploy... done.`

我最好的猜測是建議 #4 是問題Your webpack configuration is not creating a manifest. 因為清單在日志中顯示為空白，但我不知道如何解決這個問題或修復它。

更新

請注意，我仍在使用 Rails 資產管道來提供 css 和圖像。

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_root_path: public
  public_output_path: packs
  cache_path: tmp/cache/webpacker
  check_yarn_integrity: false
  webpack_compile_output: false

  # 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

  # Extract and emit a css file
  extract_css: false

  static_assets_extensions:
    - .jpg
    - .jpeg
    - .png
    - .gif
    - .tiff
    - .ico
    - .svg
    - .eot
    - .otf
    - .ttf
    - .woff
    - .woff2

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

development:
  <<: *default
  compile: true

  # Verifies that correct packages and versions are installed by inspecting package.json, yarn.lock, and node_modules
  check_yarn_integrity: 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

  # Extract and emit a css file
  extract_css: true

  # Cache manifest.json for performance
  cache_manifest: true

Answer 1

問題是這個日志消息Detected manifest file, assuming assets were compiled locally的 問題可能是您在本地運行assets:precompile然后提交public/assets目錄。

運行git rm -rf public/assets將目錄添加到.gitignore commit 並推送到 heroku。 現在應該可以工作了。

Answer 2

您的問題類似於問題 #2071 。 在您的webpacker.yml中，在生產下添加

extract_css: true