时间戳

首页 > 解决方案 > 使用 react redux 在 asp.net core2 中导入 css 文件

reactjs - 使用 react redux 在 asp.net core2 中导入 css 文件

问题描述

我的 Header.tsx 是：

import * as React from 'react';
import "./header.css"

export default class Header extends React.Component {
    public render() {
        return <div id="Header">

        </div>;
    }
}

和 header.css 是：

#Header{
    height: 100px;
    width: 100%;
    background-color: white;
}

当我运行 m 项目时，我收到此错误：

NodeInvocationException: Prerendering failed because of error: Error: Module parse failed: E:\Tools\ClientApp\components\header.css Unexpected character '#' (1:0)
You may need an appropriate loader to handle this file type.

我该如何解决？

标签： reactjsreact-reduxasp.net-core-2.0

解决方案

您需要使用css-loader来导入并在 react 应用程序中使用 css 文件。

首先安装css-loader：

npm install --save-dev css-loader

然后将 css-loader 添加到您的webpack配置中：

module.exports = {
  module: {
    rules: [
      {
        test: /\.css$/,
        use: [ 'style-loader', 'css-loader' ]
      }
    ]
  }
}

推荐阅读