时间戳

首页 > 解决方案 > React 16.13.1 CSS 模块类不适用

css - React 16.13.1 CSS 模块类不适用

问题描述

我有一个包含文件的 Person 文件夹：

人.js

Person.module.css

在 css 模块文件中，我有这个类

.Person {
    width: 60%;
    margin: 16px auto;
    border: 1px solid #eee;
    box-shadow: 0 2px 3px #ccc;
    padding: 16px;
    text-align: center;
}

然后在 Person.js 文件中我有

import React from 'react';
import Radium from 'radium';
import classes from './Person.module.css';

const person = (props) => {
    const style = {
        '@media(min-width: 500px)': {
            width: '450px'
        }
    }

    return (
        <div  className={classes.Person}>
            <p onClick={props.click}>I'm {props.name}! and I am {props.age} years old!</p>
            <p>{props.children}</p>
            <input type="text" onChange={props.changed} value={props.name}/>
        </div>
    )
};

export default Radium(person);

最后在 app 组件中，我导入 Person 组件并渲染它。我的问题是没有应用 css 类，当我检查 DOM 时，Person div 没有类

不知道我做错了什么

标签： cssreactjsreact-css-modules

解决方案

我认为问题在于我使用命令创建了应用程序

create-react-app css-module-test --scripts-version 1.1.5

旧的脚本版本意味着 css 模块功能不可用

推荐阅读