在React中使用CSS模块从节点模块导入CSS文件,可以通过以下步骤实现:
npm install react react-dom
import
语句导入所需的CSS模块。假设你要导入名为styles.css
的CSS文件,可以使用以下代码:import styles from './styles.css';
css-loader
和style-loader
来处理CSS模块。具体配置如下:module: {
rules: [
{
test: /\.css$/,
use: [
'style-loader',
{
loader: 'css-loader',
options: {
modules: true
}
}
]
}
]
}
import React from 'react';
import styles from './styles.css';
const MyComponent = () => {
return (
<div className={styles.container}>
<h1 className={styles.title}>Hello, React!</h1>
</div>
);
};
export default MyComponent;
在上述代码中,styles.container
和styles.title
是从CSS模块中导入的类名,可以直接应用于对应的元素上。
推荐的腾讯云相关产品和产品介绍链接地址:
领取专属 10元无门槛券
手把手带您无忧上云