rails6でactive_adminを使用する際に、active_adminのscssがメインのページに読み込まれてしまうのを回避する方法をご教示ください。

Question

rails6でdeviseとactive_adminを使用しているのですが、active_adminのscssがトップページなどにも読み込まれてしまいます。

active_adminのscssは、active_adminのページだけに適応させて、トップページや下層ページは、別のscssやjsを読み込む方法について、ご教示いただきたいです。

初歩的なことで申し訳ありません。

Answer 1

一番簡単なのは、layout を adminと一般にわけ、
取り込むCSSを application.css でなく、admin.css みたいに別のものを作り
それに取り込むCSSを選別する。

あと、LAYOUTの一番外側に、adminなのか一般なのかを区別する<div>例えば<div class='admin'>をかぶせ、admin用のCSSは .admin の前置修飾をつける

フロントの弱い私は、後者をすると、「.adminをつけてるのになんでこっちのCSSが生きるんだ！」と手が打てなくなることが時々あるので、前者を使ってます

追記

1. admin用のcontrllerにlayout 'admin' を追加
2. views/layouts/application.html.erb をcopyして views/layouts/admin.html.erbを作り、その中の<%= stylesheet_link_tag 'application'... のapplicationをadminに直す。
3. app/assets/stilesheets/application.css をccopyしてadmin.cssを作る
4. config/initializers/assets.rb に Rails.application.config.assets.precompile += %w(admin.css ) を追加

と準備したところで、app/assets/stilesheets/application.css と admin.css を編集してください。
`

• = require bootstrap_config
• = require basic
• = require closing_calendars
• = require layout.css
• = require layout_common.css
  の様に各々で必要なものを列挙します。 * = require_tree ` があると全部取り込んでしまいますから、これは削除。

Comments

[退会済みユーザー]

ご説明、ありがとうございます。

お手数ですが、具体的にどのように記述すれば良いかなども、教えて頂きたいです。。。

[winterboum]

何方の方法？

[退会済みユーザー]

＞一番簡単なのは、layout adminと一般にわけ、
取り込むCSSを application.css でなく、admin.css みたいに別のものを作り
それに取り込むCSSを選別する。

→こちらの方法を教えていただきたいです。
　また、もし一般的（rails6開発者が最も使う方法）に使われている方法があれば、参考サイトでも良いので、教えていただけないでしょうか？

[退会済みユーザー]

追記有り難うございます。

admin用のcontrllerにlayout 'admin' を追加のファイルが見当たりません。
どこに入っていますでしょうか？

何度もすみません。

[winterboum]

controllerにそういう行を追加する　ということです

[退会済みユーザー]

意味を汲み取れず、すみません。

うまく実装することができました！
本当に有り難うございます。

Answer 2

ご説明、ありがとうございます。

お手数ですが、具体的にどのように記述すれば良いかなども、教えて頂きたいです。。。