Я изучаю React.js и использую курс Удеми. Дело в том, что с тех пор, как курс был составлен, React был обновлен, а модули CSS были изменены. Я пытался сделать свое исследование и написал код, но классы, кажется, не применяются. Я проверил inspect в браузере и на вкладке React (с установленным расширением) написано className = {undefined}. Под вкладкой инспектора написано просто
<div>...</div>
без применения какого-либо класса.
Я назвал файлы CSS как [component] .module.css
Это один компонент, я сделал все то же самое, и у всех есть эта проблема:
import React from 'react';
// import Aux from '../../hoc/Aux';
import Ingredient from './Ingreditent/Ingredient';
import styles from './Burger.module.css';
const burger = props => (
<div className={styles.Burger}>
<Ingredient type='bread-top' />
<Ingredient type='meat'/>
<Ingredient type='bread-bottom' />
</div>
);
export default burger;
А вот CSS-файл Burger.module.css:
.Burger{
width: 50vw;
height: 30vh;
margin: auto;
overflow: scroll;
text-align: center;
font-size: 1.2rem;
font-weight: bold;
}
@media (min-width: 1000px) and (min-height: 700px){
.Burger{
width: 70vw;
height: 30vw;
}
}
EDIT:
Строки с 143 по 150 файла webpack.config.dev.js:
Файл здесь https://1drv.ms/u/s!AuFJzTL8l8Op9g5CBJ8kv8Wv-pcx
test: /\.css$/,
options: {
importLoaders: 1,
modules: true,
localIdentName: '[name]__[local]__[hash:base64:5]'
},
loader: 'style!css?importLoaders=1!postcss'
},