Viteを使っているRailsアプリに一部のBootstrap 5を導入方法
Bootstrapはかなり有名で便利ですね。早くアプリケーションが使えるようにするためよく使う場合が多いと思います。
しかし、いつも全てのBootstrapの機能が必要ではない場合もあります。その時に一部の機能だけ導入すればいいです。
今回はViteを使っているRails 7アプリにBootstrap 5を導入してみました。
Bootstrap 5 と popperjs/coreを導入
yarn add bootstrap @popperjs/core
BootstrapのCSSを導入
```scss:app/assets/stylesheets/bootstrap.scss
@import 'bootstrap/scss/functions';
@import 'bootstrap/scss/variables';
@import 'bootstrap/scss/mixins';
@import...
Created by Yuto at 2022-06-12 00:43
[Rails App] Bootstrapの開発環境を自動的に作る (bootstrap-generators)
>>> デモサイトはこちらです <<< (https://yuto-bootstrap-environment.herokuapp.com/)
参考
bootstrap-generators (https://github.com/decioferreira/bootstrap-generators)
この記事は早くBootstrapの開発環境を作る方法をご紹介させていただきます。
```ruby:Gemfile
gem 'bootstrap-sass'
group :development do
gem 'bootstrap-generators'
end
```
Bootstrapをインストール
rails g bootstrap:install [オプション]
オプション
-e=erb/haml/slim デフォルトは「ERB」
-se=css/scss/less デフォルトは「SCSS」
ERB以外の場合、views/layouts/application.html.erbを削除してください。
テストの為にScaffoldを作ります
rails g scaffold...
Created by Yuto at 2022-01-21 17:42