Rails:在 rails 6 上安装和配置引导程序

Posted

技术标签:

【中文标题】Rails:在 rails 6 上安装和配置引导程序【英文标题】:Rails: Install and configure bootstrap on rails 6 【发布时间】:2020-04-29 14:42:37 【问题描述】:

如何让 bootstrap 在 rails 6 中的自定义布局上工作

我已经使用yarn add bootstrap jquery popper.js 命令安装了引导程序,并将..app/config/webpack/environment.js 配置如下。

const  environment  = require('@rails/webpacker')
const webpack = require('webpack')
environment.plugins.append('Provide',
  new webpack.ProvidePlugin(
    $: 'jquery',
    jQuery: 'jquery',
    Popper: ['popper.js', 'default']
  )
)

module.exports = environment

..app/javascript/packs/application.js

...

    import 'bootstrap'
    import "../stylesheets/application"

..app/javascript/stylesheets/application.scss

@import '~bootstrap/scss/bootstrap';

一切正常,但是当我创建另一个布局文件时,布局没有导入引导库。

..layout/visitor.html.erb

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

bootstrap 库未在此 visitor.html.erb 布局中加载,它仅在 application.html.erb 布局文件中加载。

如何解决问题

【问题讨论】:

【参考方案1】:

你需要改变

&lt;%= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track': 'reload' %&gt;

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

【讨论】:

我已经更改了&lt;%= stylesheet_pack_tag 'application', media: 'all', 'data-turbolinks-track': 'reload' %&gt;,但仍然无法使用 不在visitor.html.erb 但我的意思是在application.html.erb @foliwe83 你的投票让我再试一次 :) 。但最终工作。 对不起

以上是关于Rails:在 rails 6 上安装和配置引导程序的主要内容,如果未能解决你的问题,请参考以下文章

Ruby on Rails - 在 OSX 上使用 Ruby 2.4.4 而不是 rails 5.1.6 的配置问题/异常

使用 Webpack 在 Rails 6 上设置 Bootstrap 4.3

如何在 Rails 6 和 Webpacker(以及引导程序和 SASS/SCSS)中安装自定义字体

Rails 6 看不到 JS

引导多选列表不会为 Rails 打开

ruby on rails 中的引导模式不起作用(不显示)