Rails 5.2 资产在生产环境中未正确加载
Rails 5.2 assets not loaded properly on production
我正在为一个 rails 项目使用 wrapbootstarp 模板，我将所有 css 和 js 文件移动到 vendors/assets 当 运行 开发中的应用程序加载时所有资产（css & js）正常，但在 heroku 中显示空白页。
我已尝试手动预编译资源，但仍显示空白页面。奇怪的是资产被加载：
<link rel="stylesheet" media="all" href="/assets/application-95017034c76c900be6f5471a85b9cbc01136147254c81d0bb0b25ee5ea4795c7.css" data-turbolinks-track="reload" />
<script src="/assets/application-aa7d1978d221c464c99b122177a647765fc068f540c747c6ebc14a1771a2b898.js" data-turbolinks-track="reload"></script>
这是我的 application.js 和 application.css：
js
//= require rails-ujs
//= require activestorage
//= require turbolinks
//= require_tree .
//= require js/jquery-3.2.1.min.js
//= require js/bootstrap.min.js
//= require js/owl.carousel.min.js
//= require js/wow.min.js
//= require js/waypoints.min.js
//= require js/jquery.counterup.min.js
//= require inc/lightbox/js/jquery.fancybox.pack.js
//= require inc/lightbox/js/lightbox.js
//= require js/fakeLoader.min.js
//= require js/scrolltopcontrol.js
//= require js/bootstrap-4-navbar.js
//= require js/jquery.magnific-popup.min.js
//= require slick/slick.min.js
//= require js/color-switcher.js
//= require js/color-switcher-active.js
//= require js/custom.js
css
*= require_tree .
*= require_self
*= require css/bootstrap.min.css
*= require fonts/css/fontawesome-all.min.css
*= require css/animate.css
*= require css/bootstrap-4-navbar.css
*= require slick/slick.css
*= require inc/lightbox/css/jquery.fancybox.css
*= require css/owl.carousel.min.css
*= require css/owl.theme.default.min.css
*= require css/fakeLoader.css
*= require css/magnific-popup.css
*= require style.css
*= require color/color-switcher.css
*= require css/responsive.css
完整的服务器日志
2019-07-09T03:06:04.554365+00:00 heroku[web.1]: State changed from up to starting
2019-07-09T03:06:05.778974+00:00 app[web.1]: - Gracefully stopping, waiting for requests to finish
2019-07-09T03:06:05.789818+00:00 app[web.1]: === puma shutdown: 2019-07-09 03:06:05 +0000 ===
2019-07-09T03:06:05.789828+00:00 app[web.1]: - Goodbye!
2019-07-09T03:06:05.789925+00:00 app[web.1]: Exiting
2019-07-09T03:06:05.762376+00:00 heroku[web.1]: Stopping all processes with SIGTERM
2019-07-09T03:06:05.885244+00:00 heroku[web.1]: Process exited with status 143
2019-07-09T03:06:08.816439+00:00 heroku[web.1]: Starting process with command `bundle exec rails server -p 9411`
2019-07-09T03:06:18.069154+00:00 heroku[web.1]: State changed from starting to up
2019-07-09T03:07:30.326358+00:00 heroku[router]: at=info method=GET path="/" host=sfaai.herokuapp.com request_id=75acf86b-661c-4eb8-bc14-7a1f06668bac fwd="73.179.45.178" dyno=web.1 connect=1ms service=116ms status=200 bytes=28535 protocol=https
2019-07-09T03:07:30.222866+00:00 app[web.1]: => Booting Puma
2019-07-09T03:07:30.222890+00:00 app[web.1]: => Rails 5.2.3 application starting in production
2019-07-09T03:07:30.222892+00:00 app[web.1]: => Run `rails server -h` for more startup options
2019-07-09T03:07:30.222895+00:00 app[web.1]: Puma starting in single mode...
2019-07-09T03:07:30.222897+00:00 app[web.1]: * Version 3.12.1 (ruby 2.5.5-p157), codename: Llamas in Pajamas
2019-07-09T03:07:30.222899+00:00 app[web.1]: * Min threads: 5, max threads: 5
2019-07-09T03:07:30.222901+00:00 app[web.1]: * Environment: production
2019-07-09T03:07:30.222903+00:00 app[web.1]: * Listening on tcp://0.0.0.0:9411
2019-07-09T03:07:30.222905+00:00 app[web.1]: Use Ctrl-C to stop
2019-07-09T03:07:30.222921+00:00 app[web.1]: I, [2019-07-09T03:07:30.222725 #4] INFO -- : [75acf86b-661c-4eb8-bc14-7a1f06668bac] Started GET "/" for 73.179.45.178 at 2019-07-09 03:07:30 +0000
2019-07-09T03:07:30.238573+00:00 app[web.1]: I, [2019-07-09T03:07:30.238463 #4] INFO -- : [75acf86b-661c-4eb8-bc14-7a1f06668bac] Processing by PagesController#index as HTML
2019-07-09T03:07:30.268578+00:00 app[web.1]: I, [2019-07-09T03:07:30.268461 #4] INFO -- : [75acf86b-661c-4eb8-bc14-7a1f06668bac] Rendering pages/index.html.erb within layouts/application
2019-07-09T03:07:30.281799+00:00 app[web.1]: I, [2019-07-09T03:07:30.281698 #4] INFO -- : [75acf86b-661c-4eb8-bc14-7a1f06668bac] Rendered layouts/partials/_sliders.html.erb (4.7ms)
2019-07-09T03:07:30.284344+00:00 app[web.1]: I, [2019-07-09T03:07:30.284063 #4] INFO -- : [75acf86b-661c-4eb8-bc14-7a1f06668bac] Rendered layouts/partials/_about.html.erb (0.9ms)
2019-07-09T03:07:30.288207+00:00 app[web.1]: I, [2019-07-09T03:07:30.288138 #4] INFO -- : [75acf86b-661c-4eb8-bc14-7a1f06668bac] Rendered layouts/partials/_services.html.erb (1.6ms)
2019-07-09T03:07:30.294139+00:00 app[web.1]: I, [2019-07-09T03:07:30.294068 #4] INFO -- : [75acf86b-661c-4eb8-bc14-7a1f06668bac] Rendered layouts/partials/_doctors.html.erb (3.7ms)
2019-07-09T03:07:30.298777+00:00 app[web.1]: I, [2019-07-09T03:07:30.298711 #4] INFO -- : [75acf86b-661c-4eb8-bc14-7a1f06668bac] Rendered layouts/partials/_testimonials.html.erb (1.3ms)
2019-07-09T03:07:30.301639+00:00 app[web.1]: I, [2019-07-09T03:07:30.301574 #4] INFO -- : [75acf86b-661c-4eb8-bc14-7a1f06668bac] Rendered pages/index.html.erb within layouts/application (29.7ms)
2019-07-09T03:07:30.307812+00:00 app[web.1]: I, [2019-07-09T03:07:30.307741 #4] INFO -- : [75acf86b-661c-4eb8-bc14-7a1f06668bac] Rendered layouts/partials/_top_menu.html.erb (2.6ms)
2019-07-09T03:07:30.311383+00:00 app[web.1]: I, [2019-07-09T03:07:30.311315 #4] INFO -- : [75acf86b-661c-4eb8-bc14-7a1f06668bac] Rendered layouts/partials/_main_menu.html.erb (1.0ms)
2019-07-09T03:07:30.315240+00:00 app[web.1]: I, [2019-07-09T03:07:30.315173 #4] INFO -- : [75acf86b-661c-4eb8-bc14-7a1f06668bac] Rendered layouts/partials/_footer.html.erb (0.8ms)
2019-07-09T03:07:30.317914+00:00 app[web.1]: I, [2019-07-09T03:07:30.317846 #4] INFO -- : [75acf86b-661c-4eb8-bc14-7a1f06668bac] Completed 200 OK in 78ms (Views: 51.3ms)```
您正在使用 display: none; 设计您的 body 标签。您在页面上看不到任何内容，因为内容已隐藏。
如果您直接将 display: none; 包含在 CSS 中，只需将其删除即可。如果您选择的 css 框架或其他 javascript 库以某种方式导致它，您需要弄清楚为什么将这种样式放在 body 标签上。
当我使用 Chrome 检查器删除样式时，我看到了网站：
我正在为一个 rails 项目使用 wrapbootstarp 模板，我将所有 css 和 js 文件移动到 vendors/assets 当 运行 开发中的应用程序加载时所有资产（css & js）正常，但在 heroku 中显示空白页。
我已尝试手动预编译资源，但仍显示空白页面。奇怪的是资产被加载：
<link rel="stylesheet" media="all" href="/assets/application-95017034c76c900be6f5471a85b9cbc01136147254c81d0bb0b25ee5ea4795c7.css" data-turbolinks-track="reload" />
<script src="/assets/application-aa7d1978d221c464c99b122177a647765fc068f540c747c6ebc14a1771a2b898.js" data-turbolinks-track="reload"></script>
这是我的 application.js 和 application.css： js
//= require rails-ujs
//= require activestorage
//= require turbolinks
//= require_tree .
//= require js/jquery-3.2.1.min.js
//= require js/bootstrap.min.js
//= require js/owl.carousel.min.js
//= require js/wow.min.js
//= require js/waypoints.min.js
//= require js/jquery.counterup.min.js
//= require inc/lightbox/js/jquery.fancybox.pack.js
//= require inc/lightbox/js/lightbox.js
//= require js/fakeLoader.min.js
//= require js/scrolltopcontrol.js
//= require js/bootstrap-4-navbar.js
//= require js/jquery.magnific-popup.min.js
//= require slick/slick.min.js
//= require js/color-switcher.js
//= require js/color-switcher-active.js
//= require js/custom.js
css
*= require_tree .
*= require_self
*= require css/bootstrap.min.css
*= require fonts/css/fontawesome-all.min.css
*= require css/animate.css
*= require css/bootstrap-4-navbar.css
*= require slick/slick.css
*= require inc/lightbox/css/jquery.fancybox.css
*= require css/owl.carousel.min.css
*= require css/owl.theme.default.min.css
*= require css/fakeLoader.css
*= require css/magnific-popup.css
*= require style.css
*= require color/color-switcher.css
*= require css/responsive.css
完整的服务器日志
2019-07-09T03:06:04.554365+00:00 heroku[web.1]: State changed from up to starting
2019-07-09T03:06:05.778974+00:00 app[web.1]: - Gracefully stopping, waiting for requests to finish
2019-07-09T03:06:05.789818+00:00 app[web.1]: === puma shutdown: 2019-07-09 03:06:05 +0000 ===
2019-07-09T03:06:05.789828+00:00 app[web.1]: - Goodbye!
2019-07-09T03:06:05.789925+00:00 app[web.1]: Exiting
2019-07-09T03:06:05.762376+00:00 heroku[web.1]: Stopping all processes with SIGTERM
2019-07-09T03:06:05.885244+00:00 heroku[web.1]: Process exited with status 143
2019-07-09T03:06:08.816439+00:00 heroku[web.1]: Starting process with command `bundle exec rails server -p 9411`
2019-07-09T03:06:18.069154+00:00 heroku[web.1]: State changed from starting to up
2019-07-09T03:07:30.326358+00:00 heroku[router]: at=info method=GET path="/" host=sfaai.herokuapp.com request_id=75acf86b-661c-4eb8-bc14-7a1f06668bac fwd="73.179.45.178" dyno=web.1 connect=1ms service=116ms status=200 bytes=28535 protocol=https
2019-07-09T03:07:30.222866+00:00 app[web.1]: => Booting Puma
2019-07-09T03:07:30.222890+00:00 app[web.1]: => Rails 5.2.3 application starting in production
2019-07-09T03:07:30.222892+00:00 app[web.1]: => Run `rails server -h` for more startup options
2019-07-09T03:07:30.222895+00:00 app[web.1]: Puma starting in single mode...
2019-07-09T03:07:30.222897+00:00 app[web.1]: * Version 3.12.1 (ruby 2.5.5-p157), codename: Llamas in Pajamas
2019-07-09T03:07:30.222899+00:00 app[web.1]: * Min threads: 5, max threads: 5
2019-07-09T03:07:30.222901+00:00 app[web.1]: * Environment: production
2019-07-09T03:07:30.222903+00:00 app[web.1]: * Listening on tcp://0.0.0.0:9411
2019-07-09T03:07:30.222905+00:00 app[web.1]: Use Ctrl-C to stop
2019-07-09T03:07:30.222921+00:00 app[web.1]: I, [2019-07-09T03:07:30.222725 #4] INFO -- : [75acf86b-661c-4eb8-bc14-7a1f06668bac] Started GET "/" for 73.179.45.178 at 2019-07-09 03:07:30 +0000
2019-07-09T03:07:30.238573+00:00 app[web.1]: I, [2019-07-09T03:07:30.238463 #4] INFO -- : [75acf86b-661c-4eb8-bc14-7a1f06668bac] Processing by PagesController#index as HTML
2019-07-09T03:07:30.268578+00:00 app[web.1]: I, [2019-07-09T03:07:30.268461 #4] INFO -- : [75acf86b-661c-4eb8-bc14-7a1f06668bac] Rendering pages/index.html.erb within layouts/application
2019-07-09T03:07:30.281799+00:00 app[web.1]: I, [2019-07-09T03:07:30.281698 #4] INFO -- : [75acf86b-661c-4eb8-bc14-7a1f06668bac] Rendered layouts/partials/_sliders.html.erb (4.7ms)
2019-07-09T03:07:30.284344+00:00 app[web.1]: I, [2019-07-09T03:07:30.284063 #4] INFO -- : [75acf86b-661c-4eb8-bc14-7a1f06668bac] Rendered layouts/partials/_about.html.erb (0.9ms)
2019-07-09T03:07:30.288207+00:00 app[web.1]: I, [2019-07-09T03:07:30.288138 #4] INFO -- : [75acf86b-661c-4eb8-bc14-7a1f06668bac] Rendered layouts/partials/_services.html.erb (1.6ms)
2019-07-09T03:07:30.294139+00:00 app[web.1]: I, [2019-07-09T03:07:30.294068 #4] INFO -- : [75acf86b-661c-4eb8-bc14-7a1f06668bac] Rendered layouts/partials/_doctors.html.erb (3.7ms)
2019-07-09T03:07:30.298777+00:00 app[web.1]: I, [2019-07-09T03:07:30.298711 #4] INFO -- : [75acf86b-661c-4eb8-bc14-7a1f06668bac] Rendered layouts/partials/_testimonials.html.erb (1.3ms)
2019-07-09T03:07:30.301639+00:00 app[web.1]: I, [2019-07-09T03:07:30.301574 #4] INFO -- : [75acf86b-661c-4eb8-bc14-7a1f06668bac] Rendered pages/index.html.erb within layouts/application (29.7ms)
2019-07-09T03:07:30.307812+00:00 app[web.1]: I, [2019-07-09T03:07:30.307741 #4] INFO -- : [75acf86b-661c-4eb8-bc14-7a1f06668bac] Rendered layouts/partials/_top_menu.html.erb (2.6ms)
2019-07-09T03:07:30.311383+00:00 app[web.1]: I, [2019-07-09T03:07:30.311315 #4] INFO -- : [75acf86b-661c-4eb8-bc14-7a1f06668bac] Rendered layouts/partials/_main_menu.html.erb (1.0ms)
2019-07-09T03:07:30.315240+00:00 app[web.1]: I, [2019-07-09T03:07:30.315173 #4] INFO -- : [75acf86b-661c-4eb8-bc14-7a1f06668bac] Rendered layouts/partials/_footer.html.erb (0.8ms)
2019-07-09T03:07:30.317914+00:00 app[web.1]: I, [2019-07-09T03:07:30.317846 #4] INFO -- : [75acf86b-661c-4eb8-bc14-7a1f06668bac] Completed 200 OK in 78ms (Views: 51.3ms)```
您正在使用 display: none; 设计您的 body 标签。您在页面上看不到任何内容，因为内容已隐藏。
如果您直接将 display: none; 包含在 CSS 中，只需将其删除即可。如果您选择的 css 框架或其他 javascript 库以某种方式导致它，您需要弄清楚为什么将这种样式放在 body 标签上。
当我使用 Chrome 检查器删除样式时，我看到了网站：