84669 人學習
152542 人學習
20005 人學習
5487 人學習
7821 人學習
359900 人學習
3350 人學習
180660 人學習
48569 人學習
18603 人學習
40936 人學習
1549 人學習
1183 人學習
32909 人學習
我一直在一個使用Next JS進行網站設計的專案中工作,想要使用CSS檔案進行元件設計,但為什麼我無法在我的元件中匯入呢? 在Next JS應用中是否可能只能使用模組化的CSS檔案?
我嘗試了很多次在我的Next JS專案中導入CSS文件,但沒有成功導入。 我已經導入了全域的CSS文件和模組化的CSS文件,但無法導入CSS文件。
如果你不想使用模組,而是想使用一個全域的CSS文件,影響所有的元件和頁面,那麼是可以的。
但是如果你想為每個元件使用單獨的CSS文件,那麼模組就是解決方案。
請參考這個文件
#如果還沒有,請建立一個pages/_app.js檔案。然後,導入styles.css檔。
pages/_app.js
import '../your_styles_file.css' // 这个默认导出在新的 `pages/_app.js` 文件中是必需的。 export default function YourApp({ Component, pageProps }) { return <Component {...pageProps} /> }
由於樣式表的全域性質和為了避免衝突,你只能在pages/_app.js中匯入它們。 styles.css中的這些樣式將應用於應用程式中的所有頁面和元件。
如果你不想使用模組,而是想使用一個全域的CSS文件,影響所有的元件和頁面,那麼是可以的。
但是如果你想為每個元件使用單獨的CSS文件,那麼模組就是解決方案。
請參考這個文件
#如果還沒有,請建立一個
pages/_app.js
檔案。然後,導入styles.css檔。由於樣式表的全域性質和為了避免衝突,你只能在pages/_app.js中匯入它們。 styles.css中的這些樣式將應用於應用程式中的所有頁面和元件。