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中的这些样式将应用于应用程序中的所有页面和组件。