将Bootstrap gem与Rails结合使用 [英] Using Bootstrap gem with Rails
问题描述
我有一个新的Rails项目，我只生成了一个控制器.我已经按照说明根据bootstrap gem安装了bootstrap，但是不断出现以下错误:
I have a fresh rails project where I only generated a controller. I've followed the directions to install bootstrap according to the bootstrap gem, and I keep getting the following error:
ActionView::Template::Error (identifier '(function(opts, pluginOpts) {return eva
l(process' undefined):
5: <%= csrf_meta_tags %>
6: <%= csp_meta_tag %>
7:
8: <%= stylesheet_link_tag 'application', media: 'all', 'data-turbol
inks-track': 'reload' %>
9: <%= javascript_include_tag 'application', 'data-turbolinks-track': '
reload' %>
10: </head>
11:
(execjs):1
app/views/layouts/application.html.erb:8:in `_app_views_layouts_application_html
_erb__511219785_80461480'
我已经按照此网页上的所有说明进行操作: https://github.com/twbs/bootstrap-rubygem
I've followed all the instructions according to this webpage: https://github.com/twbs/bootstrap-rubygem
我的代码:
# Gemfile
gem 'bootstrap', '~> 4.1.1'
gem 'jquery-rails'
# app/assets/javascripts/application.js
//= require rails-ujs
//= require activestorage
//= require turbolinks
//= require jquery3
//= require popper
//= require bootstrap
//= require_tree .
# app/assets/stylesheets/application.scss
@import "bootstrap";
注意，我也确实从application.scss中删除了* = require和* = require_tree，并且确保了它是一个scss文件而不是一个css文件.
Note, I also did remove *= require and *= require_tree from the application.scss and I did make sure that it's a scss file and not a css file.
推荐答案
这似乎是Windows上ExecJS和duktape的当前问题.
This seems to be a current issue with ExecJS and duktape on Windows.
有关更多信息，请参见以下链接: https://github.com/twbs/bootstrap-rubygem/issues/157
See the following link for more information: https://github.com/twbs/bootstrap-rubygem/issues/157
简而言之，要解决此问题，您只需从Gemfile中删除/注释duktape.如果要使用Node.js作为JS运行时，请记住实际安装它(Node.js).
In short, to resolve this issue you can simply remove/comment out duktape from your Gemfile. If you're going for Node.js as your JS runtime, remember to actually install it (Node.js).
如果仍然有问题，请从application.scss中删除所有//= require指令，并将其保留在application.js中.
If you still have problems, remove all //= require directives from your application.scss and keep those in application.js instead.
//= require rails-ujs
//= require activestorage
//= require turbolinks
//= require_tree .
//= require jquery3
//= require popper
//= require bootstrap-sprockets
application.scss
@import "bootstrap";
Gemfile
删除gem 'duktape'
gem 'autoprefixer-rails'
gem 'bootstrap', '~> 4.1.1'
gem 'jquery-rails'
关于此问题的评论:
duktape早已成为Windows中默认的JS运行时， rails/rails#30014.
duktape has become the default JS Runtime in Windows sometime ago in rails/rails#30014.
如果您调查涉及Exejs的其他类似问题，可能会发现 知道duktape实际上是罪魁祸首(但是这里的execjs duktape上下文的定义).如果您更改运行时环境 使用Nodejs，该错误将得到解决，例如 @ yasunari89
If you look into other similar issues involving Exejs you might found out that duktape is actually the culprit (however its execjs here for definition of duktape context). If you change your runtime environment to use Nodejs, the error would be resolved, as the case with @yasunari89
您可以在#152，#153和#155中找到更多信息.但是，以上问题 正则表达式无效的问题已通过新版本的duktape进行了修复，以获取更多信息 信息访问judofyr/duktape.rb#41解决了 无效的正则表达式问题，开始导致您遇到的问题 现在.发生此问题是因为(如execjs中所定义)duktape 不支持复杂的上下文和完整的JS作为标识符.
You can find more info in #152 , #153 and #155 . However, above issues with invalid regex was fixed with new version of duktape, for more info visit judofyr/duktape.rb#41 The new version which resolved the invalid regex issue , started causing issue which you are encountering now. This issue happens because ( as defined in execjs) duktape doesn't support complex contexts and full JS as identifier.
但是，正在审查可能会解决此问题的PR， 感谢@judofyr
However a PR is under review that will possibly resolve the issue, thanks to @judofyr
您还应该确保正确设置了application.html.erb.这是一个示例:
You should also make sure that your application.html.erb is setup correctly. Here is an example:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<title>title</title>
<%= csrf_meta_tags %>
<%= csp_meta_tag %>
<%= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track': 'reload' %>
<%= javascript_include_tag 'application', 'data-turbolinks-track': 'reload' %>
</head>
<body>
<div class="container">
<%= yield %>
</div>
</body>
</html>
ExecJS支持多个运行时，而不仅仅是duktape和NodeJS. https://github.com/rails/execjs
ExecJS supports several runtimes, not just duktape and NodeJS. https://github.com/rails/execjs
ExecJS supports these runtimes:
therubyracer - Google V8 embedded within Ruby
therubyrhino - Mozilla Rhino embedded within JRuby
Duktape.rb - Duktape JavaScript interpreter
Node.js
Apple JavaScriptCore - Included with Mac OS X
Microsoft Windows Script Host (JScript)
Google V8
mini_racer - Google V8 embedded within Ruby
这篇关于将Bootstrap gem与Rails结合使用的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
