![](/img/trans.png)
[英]ActionController::RoutingError (No route matches [GET] "/assets/javascripts
[英]ActionController::RoutingError (No route matches [GET] “/vendor/assets/stylesheets/bootstrap.min.css”)
我在 Rails 上做这个应用程序,页面加载正常,但在控制台中,出现:
Started GET "/vendor/assets/stylesheets/bootstrap.min.css" for ::1 at 2020-08-17 09:09:51 -0500
Started GET "/vendor/assets/javascripts/bootstrap.min.js" for ::1 at 2020-08-17 09:09:51 -0500
ActionController::RoutingError (No route matches [GET]
"/vendor/assets/stylesheets/bootstrap.min.css"):
ActionController::RoutingError (No route matches [GET]
"/vendor/assets/javascripts/bootstrap.min.js"):
在我的供应商文件夹中,我有两个文件夹,javascripts 和样式表,并且在它们各自的 bootsrtrap.min 中。 即使在 application.html.erb 我有以下内容:
<link href="vendor/assets/stylesheets/bootstrap.min.css" rel="stylesheet"> <%= csrf_meta_tags %> <%= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track': 'reload' %> <%= javascript_include_tag 'application', 'data-turbolinks-track': 'reload' %> </head> <body> <.-- Navigation --> <nav class="navbar navbar-expand-lg navbar-dark bg-dark static-top"> <div class="container"> <a class="navbar-brand" href="#">Instagram Clone</a> <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarResponsive" aria-controls="navbarResponsive" aria-expanded="false" aria-label="Toggle navigation"> <span class="navbar-toggler-icon"></span> </button> <div class="collapse navbar-collapse" id="navbarResponsive"> <ul class="navbar-nav ml-auto"> <li class="nav-item active"> <a class="nav-link" href="#">Home <span class="sr-only">(current)</span> </a> </li> <li class="nav-item"> <a class="nav-link" href="#">About</a> </li> <li class="nav-item"> <a class="nav-link" href="#">Services</a> </li> <li class="nav-item"> <a class="nav-link" href="#">Contact</a> </li> </ul> </div> </div> </nav> <.-- Page Content --> <div class="container"> <div class="row"> <div class="col-lg-12 text-center"> <%= yield %> </div> </div> </div> <.-- Bootstrap core JavaScript --> <.--<script src="vendor/jquery/jquery.slim.min.js"></script>--> <script src="vendor/assets/javascripts/bootstrap.min.js"></script> </body> </html>
在两个应用程序文件 js 和 CSS 中,我都输入了“require bootsrtrap.min”,即使该错误仍然出现在我的控制台中。 会是什么呢?
RoR 不使用文件夹结构所指示的目录。 因为有一个资产加载器。 您应该在 application.css 中导入 css 和在 rails 5 或更低版本的 application.js 中的 js。 并使用自己的帮助程序添加捆绑文件:
yarn add bootstrap @popperjs/core jquery
或者
npm i bootstrap @popperjs/core jquery
//...
require bootstrap/dist/css/bootstrap.min
//...
但如果你愿意,我建议使用 SCSS,只导入你需要的 styles。
//...
//= require jquery
//= require @popperjs/core
//= require bootstrap/dist/js/bootstrap.min
//...
<head>
...
<%= stylesheet_link_tag 'application', media: 'all' %>
</head>
<body>
...
<%= javascript_include_tag 'application' %>
</body>
//...
import 'bootstrap'
//...
import 'jquery'
import 'popper.js'
import 'bootstrap'
import '../stylesheets/application'
<head>
...
<%= stylesheet_pack_tag 'application', media: 'all', 'data-turbolinks-track': 'reload' %>
<%= javascript_pack_tag 'application', 'data-turbolinks-track': 'reload' %>
</head>
之后,您应该可以在所有应用程序中使用引导程序!
[解决方案] 所以在我的 Html (application.html.erb) 里面我对 js 和 css 文件有两个调用:
<script src="assets/javascripts/bootstrap.min.js"></script> <%= javascript_include_tag 'application', 'data-turbolinks-track': 'reload' %> <link href="assets/stylesheets/bootstrap.min.css" rel="stylesheet"> <%= csrf_meta_tags %> <%= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track': 'reload' %>
正如您在上面看到的,在 javascript 的情况下,我有一个带有脚本的调用和其他带有 <%=%> 的调用,两者都有问题,所以你只需要评论一个,我在我的 java 文件和 CSS 文件的情况。 像这样:
<.--<link href="assets/stylesheets/bootstrap.min.css" rel="stylesheet">--> <.--<script src="assets/javascripts/bootstrap.min.js"></script>-->
对我来说,这解决了问题,我真的尝试了一切,这就是解决方案哈哈。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.