css-loader 不导入 .css 文件返回空对象 [英] css-loader not importing .css file returning empty object

问题描述

从 css 文件导入样式.返回空对象.似乎 css-loader 工作不正常.谁可以帮我这个事.请在下面找到参考文件

Importing style from css files. Returning empty object. Seems css-loader is not working correctly. Can anyone help me on this. Please find the reference files below

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'],
}

推荐答案

我想知道这是否可能是您没有使用 css-modules.您展示的示例是实现加载器的 css-modules 功能的示例.

I wonder if this is perhaps you are not using css-modules. The example you are showing there is an example of implementing the css-modules feature of the loader.

也许可以尝试将 ?modules 查询添加到您的 css-loader 定义中.

Perhaps try adding the ?modules query to your css-loader definition.

这篇关于css-loader 不导入 .css 文件返回空对象的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！