Q&A
経緯
SPAではjsからビューを操作することによって、擬似的にページの遷移を行いますよね。
なのでHTMLファイルは自ずと一つだけになります。
そのHTMLファイルにCSSを読み込ませると、全てのコンポーネントにそのCSSが適用されてしまいます。
そうなるとSPAにおいて複数ページを作る場合、後々ID名やクラス名の衝突が起こる可能性があり、スタイリングをする際に色々と面倒になりそうです。
SPAにおいてページ別にCSSを適用する方法はないものかと思い、検索をしてみたのですが、それらしい記事は見当たらず。
※開発環境はcreate-react-appとreact-routerのモジュールをインストールして作った環境です。
質問
ヒントとなるキーワードや単語または参考になりそうなウェブサイトのリンクを教えて欲しいです。
ヒントだけあれば、そこからは自己解決出来ると思うので。。。！
宜しくお願い致します。
回答1件
0
ベストアンサー
コンポーネントごとにCSSを分けたい
私自身、十分に理解できてないのですが、Web Components が気になりますね。
チュートリアルセクションで案内される Template と Slot を使ってみよう ではインラインスタイルの例が載っています。
外部CSSは試していませんが、「コンポーネントごとにスタイルを分ける」ことは、標準で出来そうです。
（YoutubeのHTMLソースを覗くと、活用されてるようです）
ヒントだけあれば、そこからは自己解決出来ると思うので。。。！
明確な回答はできませんが、一度、WebComponents を調べてみてはどうでしょうか。
投稿2019/12/30 21:56
総合スコア5432
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2019/12/31 04:09
2019/12/31 05:12 編集
2019/12/31 09:29
2019/12/31 09:31