使用 webpacker 部署到 heroku 后，资产管道中不存在资产答案

【问题标题】：Asset is not present in asset pipeline after deploy to heroku with webpacker使用 webpacker 部署到 heroku 后，资产管道中不存在资产
【发布时间】：2019-10-27 10:34:08
【问题描述】：

我正在使用 Rails 5.2.3

我可以在本地下载 pdf，但在 Heroku 上通过错误 500 下载。

错误是：ActionView::Template::Error（资产“pdf.css”不在资产管道中。）：

这是我的heroku日志

2019-06-12T20:26:05.707039+00:00 app[web.1]: I, [2019-06-12T20:26:05.706962 #4]  INFO -- : [b789ac1d-fe64-434c-b259-a2f3949a7bd0]   Rendered clients/orders/show.pdf.erb within layouts/clients/application.pdf.erb (38.4ms)
2019-06-12T20:26:05.709399+00:00 app[web.1]: I, [2019-06-12T20:26:05.709314 #4]  INFO -- : [b789ac1d-fe64-434c-b259-a2f3949a7bd0] Completed 500 Internal Server Error in 55ms (ActiveRecord: 16.2ms)
2019-06-12T20:26:05.710722+00:00 app[web.1]: F, [2019-06-12T20:26:05.710296 #4] FATAL -- : [b789ac1d-fe64-434c-b259-a2f3949a7bd0]
2019-06-12T20:26:05.710724+00:00 app[web.1]: F, [2019-06-12T20:26:05.710384 #4] FATAL -- : [b789ac1d-fe64-434c-b259-a2f3949a7bd0] ActionView::Template::Error (The asset "pdf.css" is not present in the asset pipeline.):
2019-06-12T20:26:05.710726+00:00 app[web.1]: F, [2019-06-12T20:26:05.710579 #4] FATAL -- : [b789ac1d-fe64-434c-b259-a2f3949a7bd0]     1: <html lang="fr">
2019-06-12T20:26:05.710728+00:00 app[web.1]: [b789ac1d-fe64-434c-b259-a2f3949a7bd0]     2: <head>
2019-06-12T20:26:05.710732+00:00 app[web.1]: [b789ac1d-fe64-434c-b259-a2f3949a7bd0]     3:   <meta charset="utf-8" />
2019-06-12T20:26:05.710733+00:00 app[web.1]: [b789ac1d-fe64-434c-b259-a2f3949a7bd0]     4:   <%= wicked_pdf_stylesheet_link_tag 'pdf' %>
2019-06-12T20:26:05.710734+00:00 app[web.1]: [b789ac1d-fe64-434c-b259-a2f3949a7bd0]     5: </head>
2019-06-12T20:26:05.710736+00:00 app[web.1]: [b789ac1d-fe64-434c-b259-a2f3949a7bd0]     6: <body>
2019-06-12T20:26:05.710737+00:00 app[web.1]: [b789ac1d-fe64-434c-b259-a2f3949a7bd0]     7:   <div>
2019-06-12T20:26:05.710739+00:00 app[web.1]: F, [2019-06-12T20:26:05.710659 #4] FATAL -- : [b789ac1d-fe64-434c-b259-a2f3949a7bd0]
2019-06-12T20:26:05.710815+00:00 app[web.1]: F, [2019-06-12T20:26:05.710734 #4] FATAL -- : [b789ac1d-fe64-434c-b259-a2f3949a7bd0] app/views/layouts/clients/application.pdf.erb:4:in `_app_views_layouts_clients_application_pdf_erb___1711932080367152756_47199839415040'
2019-06-12T20:26:05.710823+00:00 app[web.1]: [b789ac1d-fe64-434c-b259-a2f3949a7bd0] app/controllers/clients/orders_controller.rb:19:in `block (2 levels) in show'
2019-06-12T20:26:05.710825+00:00 app[web.1]: [b789ac1d-fe64-434c-b259-a2f3949a7bd0] app/controllers/clients/orders_controller.rb:16:in `show'

在我的views/layouts 我有application.pdf.erb

<html lang="fr">
<head>
  <meta charset="utf-8" />
  <%= wicked_pdf_stylesheet_link_tag 'pdf' %>
</head>
<body>
  <div>
    <%= yield %>
  </div>
</body>
</html>

pdf文件的存储方式如下vendor/assets/stylesheets/pdf.scss ，在供应商我也有一个自定义引导文件bootstrap.min.css

pdf.scss

@import "bootstrap.min";

.someclass {}

在config/initializers/assets.rb我有这行：

Rails.application.config.assets.precompile += %w( pdf.scss, chartkick.js)

我也在使用 webpacker，这可能是问题所在......

这是我的 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

在 public/assets 文件（本地）和 heroku 上没有 pdf 文件的踪迹....

我在这里错过了什么？

我可以转发更多代码，请告诉我...我真的希望你能帮助我。

编辑

这是我的 package.json 我移动了 webpack-cli 但它仍然不起作用:( 我再次部署，我应该运行一个新命令来使其正常工作吗？

{
  "name": "kamelot",
  "private": true,
  "dependencies": {
    "@rails/webpacker": "3.5",
    "babel-preset-react": "^6.24.1",
    "flatpickr": "^4.5.7",
    "highcharts": "^7.1.1",
    "prop-types": "^15.7.2",
    "react": "^16.8.6",
    "react-color": "^2.17.3",
    "react-dom": "^16.8.6",
    "react_ujs": "^2.5.0",
    "webpack-cli": "^3.3.4"
  },
  "devDependencies": {
    "webpack-dev-server": "2.11.2"
  }
}

【问题讨论】：

标签： ruby-on-rails heroku webpack

【解决方案1】：

这是一个很长的镜头，但是在 Webpacker v4 中有一个 known issue，其中 webpack-cli 在 package.json 配置文件中被标记为 devDependency。

当部署任务运行webpacker:compile且没有webpack-cli时，没有报错，所以部署完成但public/packs文件夹中没有编译文件。

要解决此问题，您应该简单地将 webpack-cli 依赖项从 devDependencies 移到 dependencies。

更新

如果您使用capistrano 来部署您的项目，您应该在deploy.rb 配置文件中将public/packs 和node_modules（最后一个是可选的）添加到您的linked_dirs：

此外，如果您使用 node_modules，则必须在预编译资产之前运行 yarm:install。为此，只需将此任务添加到您的 deploy.rb 文件中：

before "deploy:assets:precompile", "deploy:yarn_install"
namespace :deploy do
  desc "Run rake yarn install"
  task :yarn_install do
    on roles(:web) do
      within release_path do
       execute("cd #{release_path} && yarn install --silent --no-progress --no-audit --no-optional")
      end
    end
  end
end

有关这方面的更多详细信息，请查看 webpacker documentation 了解 capistrano 部署。

更新 2

这是另一个远景，但有一个reported issue，其中heroku buildpacks 的顺序会影响资产编译过程。 node buildpack 必须先出现，然后是 ruby buildpack。以下应该可以解决问题：

heroku buildpacks:clear
heroku buildpacks:set heroku/nodejs
heroku buildpacks:add heroku/ruby

在同一问题中建议的另一个快速修复方法是在 heroku 控制台中运行 rake webpacker:compile，但这不能解决部署资产编译问题。

【讨论】：

我添加了我的 package.json 并移动了 webpack-cli，没有任何变化:(
可能是因为您的capistrano 配置。我更新了我的答案，以便您查看。
我不使用 Capistrano... 部署时我使用 git push heroku master... 我该怎么办？
@johan 我再次更新了我的答案。希望这个对你有帮助。
我按照你的建议做了，但没有成功:( vendor 文件夹根本没有编译，也没有在本地编译，也没有在 heroku 上编译