© 2023 Feiniao, Inc. All rights reserved.

如何在rails中使用bootstrap - 怎么在rails中使用bootstrap?

Rails Bootstrap
Bootstrap是一个功能强大、功能丰富的前端工具包。从原型到生产,在几分钟内即可完成任何工作。
方法1

创建项目时添加bootstrap参数,执行命令,

rails new myapp -c bootstrap

之后自动生成/assets/stylesheets/application.bootstrap.scss文件并包含如下配置,

@import 'bootstrap/scss/bootstrap';
@import 'bootstrap-icons/font/bootstrap-icons';

方法2

1,添加bootstrap到gemfile,运行命令bundle。

gem 'bootstrap', '~> 5.3.0.alpha3'

2,重命名application.css为application.scss,导入bootstrap到application.scss。

@import "bootstrap"; # 删除所有默认生成的 *= require 和 *= require_tree

3,importmap中固定bootstrap.js,运行命令,

bin/importmap pin bootstrap

/config/importmap.rb 将自动添加两行配置,如下,

pin "bootstrap", to: "https://ga.jspm.io/npm:bootstrap@5.3.0/dist/js/bootstrap.esm.js"
pin "@popperjs/core", to: "https://ga.jspm.io/npm:@popperjs/core@2.11.8/lib/index.js"

4,添加js文件到config/initializers/assets.rb。

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

5,配置application.js。

import "bootstrap"