css 로더가 가져 오지 않음 .css 파일이 빈 객체를 반환합니다.

Question

CSS 파일에서 스타일 가져 오기. 빈 객체를 반환합니다. css-loader가 올바르게 작동하지 않는 것 같습니다. 아무도 이것에 나를 도울 수 있습니까.

하는 index.js 아래의 참조 파일을 찾아주세요

import React from 'react' 
import style from './header.css' 

console.log(style) // Returning empty object 

export default class Header extends React.PureComponent { 
    render() { 
    return(
     <header className = {style.header}> 
     This is header component 
     </header> 
    ) 
    } 
} 

./header.css

.header { 
    background: #007DC6; 
} 

./webpack.config.js

{ 
    test: /\.css$/, 
    exclude: /node_modules/, 
    loaders: ['style-loader', 'css-loader'], 
}, { 
    test: /\.css$/, 
    include: /node_modules/, 
    loaders: ['style-loader', 'css-loader'], 
} 

Answer 1

아마도 이것이 css-modules을 사용하지 않는 것이 아닌지 궁금합니다. 여기에 표시되는 예제는 로더의 css-modules 기능을 구현하는 예제입니다.

css-loader 정의에 ?modules 쿼리를 추가하는 것이 좋습니다.