next.js を使って開発をしています。
keyframesを使ってアニメーションを効かせたいのですが調べてみたところnext.jsではstaticというフォルダを作り、その中にcssファイルを作るらしく、プロジェクト内にsrc/static/animation.scssというファイルを作りコードを記述しました。
_document.tsxのなかに以下のように記述しましたがscssがうまく読み込まれず適応されません。
わかる人いましたらご教授お願いしたいです
追記
適応させたいアニメーションはこれです
https://www.youtube.com/watch?v=zoe8WlCV_UE
import NextDocument, { Head, Main, NextScript } from 'next/document'; class Document extends NextDocument { render() { return ( <Head> <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" /> <link rel="stylesheet" type="text/scss" href="static/animation.scss" /> <body> <Main /> <NextScript /> </body> </Head> ); } } export default Document;
回答2件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
退会済みユーザー
2020/09/10 15:43
2020/09/10 15:48
退会済みユーザー
2020/09/10 16:09