Rails:Webpacker 4.2无法在/app/public/packs/manifest. json heroku中找到应用程序

fnatzsnv  于 2023-08-06  发布在  Webpack
关注(0)|答案(6)|浏览(131)

我有点困惑。我的本地rails应用程序在webpacker 4.2和react上运行得很好,但是当部署到生产环境时,给了我一个很棒的can't find application in /app/public/packs/manifest.json错误。
以下是我尝试过的:

  • 尝试添加/删除JavaScript包标记的turbo链接详细信息。
  • 删除了JavaScript include标签(不确定这是否有帮助)
  • 确保我使用最新的webpacker 4.2
  • 运行了rake assets:clean && rake assets:在heroku上手动预编译,以确保正在构建。
    我是否错过了一个构建步骤或生产中的某个东西会导致此问题?还有什么需要检查的?

服务器错误:

2019-12-03T15:18:19.022024+00:00 app[web.1]: I, [2019-12-03T15:18:19.021952 #30]  INFO -- : [aa0374eb-bab1-40cc-b40b-6ae3d195e07d] Completed 500 Internal Server Error in 112ms (ActiveRecord: 30.4ms | Allocations: 21296)
2019-12-03T15:18:19.023103+00:00 app[web.1]: F, [2019-12-03T15:18:19.023029 #30] FATAL -- : [aa0374eb-bab1-40cc-b40b-6ae3d195e07d]
2019-12-03T15:18:19.023107+00:00 app[web.1]: [aa0374eb-bab1-40cc-b40b-6ae3d195e07d] ActionView::Template::Error (Webpacker can't find application in /app/public/packs/manifest.json. Possible causes:
2019-12-03T15:18:19.023109+00:00 app[web.1]: 1. You want to set webpacker.yml value of compile to true for your environment
2019-12-03T15:18:19.023111+00:00 app[web.1]: unless you are using the `webpack -w` or the webpack-dev-server.
2019-12-03T15:18:19.023114+00:00 app[web.1]: 2. webpack has not yet re-run to reflect updates.
2019-12-03T15:18:19.023116+00:00 app[web.1]: 3. You have misconfigured Webpacker's config/webpacker.yml file.
2019-12-03T15:18:19.023118+00:00 app[web.1]: 4. Your webpack configuration is not creating a manifest.
2019-12-03T15:18:19.023120+00:00 app[web.1]: Your manifest contains:

{
 "application.js": "/packs/js/application-2a0e2c932678ebbf2ae7.js",
"application.js.map": "/packs/js/application-2a0e2c932678ebbf2ae7.js.map",
"entrypoints": {
 "application": {
"js": [
"/packs/js/application-2a0e2c932678ebbf2ae7.js"
],
 "js.map": [
 "/packs/js/application-2a0e2c932678ebbf2ae7.js.map"
 ]
 },
 "server_rendering": {
 "js": [
 "/packs/js/server_rendering-eb794d024d4852e8ab55.js"
],
 "js.map": [
 "/packs/js/server_rendering-eb794d024d4852e8ab55.js.map"
 ]
}
 },
"server_rendering.js": "/packs/js/server_rendering-eb794d024d4852e8ab55.js",
"server_rendering.js.map": "/packs/js/server_rendering-eb794d024d4852e8ab55.js.map"
}

...

<%= stylesheet_link_tag    'application', media: 'all', 'data-turbolinks-track': 'reload' %>
<%= stylesheet_pack_tag 'application', media: 'all', 'data-turbolinks-track': 'reload' %>
<%= javascript_pack_tag 'application' %>

<link href="https://fonts.googleapis.com/css?family=Open+Sans|Roboto+Slab:700&display=swap" rel="stylesheet">

2019-12-03T15:18:19.023193+00:00 app[web.1]: [aa0374eb-bab1-40cc-b40b-6ae3d195e07d] app/views/layouts/application.html.erb:10

字符串
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: ['app/assets']

      # 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:
        - .jsx
        - .vue
        - .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: true

      # Extract and emit a css file
      extract_css: true

      # Cache manifest.json for performance
      cache_manifest: true

yzxexxkh

yzxexxkh1#

看起来你的manifest.json中没有application.css,这意味着你可能没有从你的Webpack JavaScript文件中导入任何css。
如果这都是真的,那么您可以通过以下方法之一修复生产中的错误:

  • 快速(临时)修复:将extract_css: false添加到config/webpacker.yml中的production块(这将模拟您的本地环境)
  • 如果你不想用Webpacker编译css:从应用程序布局中删除<%= stylesheet_pack_tag 'application' %>
  • 如果你想用Webpacker编译一些css:从Webpack JavaScript导入至少一个css文件
q8l4jmvw

q8l4jmvw2#

我在本地示例上也遇到了同样的错误。
在尝试了很多变通方法之后,下面的步骤对我很有效

bundle exec rails webpacker:install

字符串
尽管此命令失败,并出现以下错误
gyp:未检测到Xcode或CLT版本!gyp错误!配置错误gyp错误!堆栈错误:gyp失败,退出代码:1 gyp ERR!stack at ChildProcess.onCpExit(/Users//Documents/Ruby/udemy/test/alpha-blog/alpha-blog/node_modules/node-gyp/lib/configure.js:345:16)gyp ERR!stack at ChildProcess.emit(node:events:376:20)gyp ERR!stack at Process.ChildProcess._handle.onexit(node:internal/child_process:284:12)gyp ERR!System达尔文19.6.0 gyp错误!command“/usr/local/Cellar/node/15.5.0/bin/node”“/Users//Documents/Ruby/udemy/test/alpha-blog/alpha-blog/node_modules/node-gyp/bin/node-gyp.js”“rebuild”“--verbose”“--libsass_ext=”“--libsass_cflags=”“--libsass_ldflags=”“--libsass_library=”gyp ERR!cwd /Users/*/Documents/Ruby/udemy/test/alpha-blog/alpha-blog/node_modules/node-sass gyp错误!node -v v15.5.0 gyp错误!node-gyp -v v3.8.0 gyp错误!不好
为了纠正这个问题,我使用了以下堆栈溢出答案(在macOS Catalina 上)
https://stackoverflow.com/a/60860951/5876113
然后运行以下命令

bundle exec rails webpacker:install


在完成上述步骤后,我没有再次得到错误。请验证这是否适用于您,因为您在Heroku部署上遇到了问题。

4bbkushb

4bbkushb3#

如果你使用的是Rails 6+和webpacker,那么由于最新的Rails 6更新,JavaScript和CSS文件都被移到了app/javascript而不是app/assets下。

app/javascript:
  ├── packs:
  │   # only webpack entry files here
  │   └── application.js
  └── src:
  │   └── application.css
  └── images:
      └── logo.svg

字符串
但是如果你已经从旧版本升级到新版本,但仍然想从app/assets/stylesheets文件夹编译CSS,那么请遵循以下调整:
1.在config/webpacker.yml中更新下面的webpack,以在解析的路径中包含app/assets

// config/webpacker.yml

resolved_paths: ['app/assets']


1.将下面的行复制到app/javascript/packs/application.js

// app/javascript/packs/application.js

import 'stylesheets/application'


这应该可以修复运行bin/webpack-dev-server时的CSS编译问题。

jdg4fx2g

jdg4fx2g4#

我在将Rails应用程序从Rails 5版本升级到Rails 6版本后遇到了同样的问题。

我尝试了下面的解决方案,但没有一个对我有效

重新安装webpacker

bundle exec rails webpacker:install

字符串
在本地和生产中重新配置资产

rails assets:precompile

rails assets:precompile RAILS_ENV=production


删除我的node模块和public/assets文件,重新运行yarn install:

rm -rf node_modules
rails assets:clobber
rails assets:precompile


我甚至将编译好的生产资产推送到Git并部署到生产中

rails assets:precompile RAILS_ENV=production
git add public/assets -f
git commit -m "Vendor compiled assets"

这是我的工作

我打开了config/environments/production.rb文件,并添加了下面的配置:

# Do not fallback to assets pipeline if a precompiled asset is missed.
config.assets.compile = false


现在当我再次推到Heroku时,一切都很好。
因此,这个命令的作用是--如果Rails 6应用程序中没有这个命令,则假定config.assets.compile被设置为true,或者config.assets.compile默认为true。所以发生的事情是,每个对/assets中文件的请求都被传递到Sprockets。在第一次请求每一个资产时,它都被编译并缓存在Rails用于缓存的任何地方(通常是文件系统)。在随后的请求中,Sprockets接收到请求并必须查找指纹文件名,检查组成资产的文件(图像)或文件(css和js)是否未被修改,然后如果有缓存版本,则提供该版本。已知此设置会导致其他运行时不稳定性,通常不建议使用此设置

资源:在生产环境中将编译设置为True

就这些了

希望这能帮上忙

n3h0vuf2

n3h0vuf25#

上述公认的解决方案解决了大多数问题,但如果像我一样,你继续有问题后,遵循每一个指示和每一个解决方案。下面的内容可能会对你有所帮助。
在经历了一系列错误之后,我发现了以下作品。
根据我的经验,这与webpacker和你的nvm安装有关。若要尝试解决方案,请先恢复为调试该问题而执行的任何其他操作。你需要确保你运行的是最新的webpacker版本。
然后我会跑:

rails webpacker:compile

字符串
在你的终端。
如果它编译时没有节点警告,那么一切都很好。如果它给你一个关于你的节点版本的警告,和/或它不编译,安装最新的LTS节点版本。我的是16131关于ubuntu这很重要。node的最新版本不一定是最新的lts版本。您需要在主目录中安装。运行:

nvm install --lts
    nvm use --lts


您可能希望将其设置为默认值,例如。:

nvm alias default 16.13.1


还要确保应用程序布局具有:

<%= javascript_pack_tag 'application', 'data-turbolinks-track': 'reload' %>


一旦完成,运行webpacker,再次如上所述编译。
如果你在这之后有任何问题,你也可以尝试在你的config / initializer / assets.rb文件中添加以下内容:

Rails.application.config.assets.precompile += %w(application.js)

wvyml7n5

wvyml7n56#

我遇到了同样的错误,并尝试了所有建议的解决方案,但问题仍然存在。最后,我意识到我的节点版本是v16.14.0,所以我切换到v14.18.3,这为我解决了问题。希望这对将来的其他人有所帮助。

相关问题