stylesheet_link_tag でエラー

Question

Rails 上で SCSS に bootstrap のクラスを使いたいです

最終的にやりたいことは 「Rails でかかれたデータ分析画面にきれいなデザインをあてる」
→　そのために bootstrap ベースのダッシュボードテンプレートをあてたい
→　view を bootstrap4 に書き直したい
→　bootstrap を使うと HTML が重複したクラスだらけになる
→　https://teratail.com/questions/52379　これと同じく bootstrap3 のクラス名や共通部品へのクラス指定はCSS側に側にまとめてHTML側のクラスを最小限にしたい

という感じです

試しに @extend で bootstrap クラスを呼び出そうとしても存在しないといわれます
どうすれば SCSS 内で bootstrap 内のクラスをよびだせるんでしょうか

Rails もさわりはじめて数週間で bootstrap SCSS ははじめてなのですが
何から手を付けていいかわからず困っています

よろしくおねがいします

追記：

https://qiita.com/shizuma/items/83cdadbe0a629f1f74d1

この手順どおり Gemfile に
gem 'bootstrap-sass' を追加し
（gem 'sass-rails'　はすでにかかれていました）
bundle install で

Fetching bootstrap-sass 3.3.7
Installing bootstrap-sass 3.3.7

インストールを確認し、
rails を起動しなおしたのですが

application.scss に
@import “bootstrap-sprockets”;
@import "bootstrap";
とかいても

Invalid CSS after "@import ": expected file to import (string or url()), was "“bootstrap-spro..."

というエラーになります

追記：

GEM や require をいろいろさわってたら
@import 'bootstrap' でエラーはでなくなりました

ただ

@import "bootstrap";

.navbar {
  @extend .px-1;
}

とかいても .px-1 が syntax error になります
HTML に class="navbar" とかくだけで細かいデザインはCSS側にかきたいのですが
こういう書き方では class="navbar px-1" とかくのと同じにはならないのでしょうか…

追記：

https://github.com/rails/jquery-rails

bootstrap4 を使うには bootstrap-sass ではなく bootstrap をいれなければいけなかったようです

gem 'bootstrap'

をかいて

bundle install をしただけなのですが

uninitialized constant ExecJS::Runtimes::RubyRacerRuntime
<%= stylesheet_link_tag    'application', media: 'all', 'data-turbolinks-track' => true %>

というエラーになります

他の変更をすべて戻して動いてる状態から
gem 'bootstrap' の追加と bundle install のみで rails s をするとこうなります

bundle install で変更された Gem は以下

Fetching autoprefixer-rails 9.1.3
Installing autoprefixer-rails 9.1.3
Fetching popper_js 1.14.3
Installing popper_js 1.14.3
Fetching bootstrap 4.1.3
Installing bootstrap 4.1.3

エラーメッセージで検索するといくつかヒットして

<%= stylesheet_link_tag    'application', media: 'all', 'data-turbolinks-track' => true %>

の application を default にすると動く
というものでしたがこれは assets に存在しないファイルをよみこんで404のままスルーしてるだけで
application 以外の存在する css, scss を読み込もうとしても同じエラーがでます

FullTrace をみると最後のほうが

lib/autoprefixer-rails/processor.rb:149:in `runtime'
autoprefixer-rails (9.1.3) lib/autoprefixer-rails/processor.rb:37:in `process'
autoprefixer-rails (9.1.3) lib/autoprefixer-rails/sprockets.rb:20:in `run'
autoprefixer-rails (9.1.3) lib/autoprefixer-rails/sprockets.rb:14:in `call'
sprockets (3.4.0) lib/sprockets/processor_utils.rb:75:in `call_processor'

ってなってるので autoprefixer のバージョンがあがったのが悪いのかな…
とはいえ解決方法がまったくわからないのでどなたか助けていただけるとうれしいです

Answer 1

やっぱり autoprefixer を更新したのがだめだったっぽい

gem 'autoprefixer-rails', '~> 9.0.0'

ではだめで

gem 'autoprefixer-rails', '~> 8.0'

にしたらなおった

https://github.com/postcss/autoprefixer/commit/b41f52a939144f0f2e230801986bc7142f163e03#diff-354f30a63fb0907d4ad57269548329e3

install:
  - YARN_IGNORE_ENGINES=true yarn

を加えたら 9.1.3 でも動いたので何してるかは不明だけどこのコミットのせいみたいです