在React js的tsx组件中读取css文件时出现问题

Question

我正在创建一个电子js应用程序并响应js，我遵循了该网站上建议的最佳实践：https://morioh.com/p/0222de07e2e2，但是由于使用了两个，因此我发现在组件导入中读取css的问题要生成的webpack，在执行导入'./style.css'时，我没有读取任何样式加载，我在webpack中添加了css扩展名，但由于我不读取样式，所以我无法理解。

webpack.react.config.js

const path = require("path");
const HtmlWebPackPlugin = require("html-webpack-plugin");

const htmlPlugin = new HtmlWebPackPlugin({
  template: "./src/index.html",
  filename: "./index.html"
});

const config = {
  target: "electron-renderer",
  devtool: "source-map",
  entry: "./src/app/renderer.tsx",
  output: {
    filename: "renderer.js",
    path: path.resolve(__dirname, "dist")
  },
  module: {
    rules: [
      {
        test: /\.(ts|tsx)$/,
        exclude: /node_modules/,
        use: {
          loader: "babel-loader"
        }
      },
      {
        test: /\.(css|scss)$/,
        exclude: /node_modules/,
        use: {
          loader: "css-loader"
        }
      },
      { test: /\.(png|jpg|jpeg|gif|svg)$/, 
        use: 'url-loader?limit=1000' 
      }
    ]
  },
  resolve: {
    extensions: [".ts", ".tsx", ".js", ".css"]
  },
  plugins: [htmlPlugin]
};

module.exports = (env, argv) => {
  return config;
};

webpack.config.js

const path = require("path");

const config = {
  target: "electron-main",
  devtool: "source-map",
  entry: "./src/main.ts",
  output: {
    filename: "main.js",
    path: path.resolve(__dirname, "dist")
  },
  module: {
    rules: [
      {
        test: /\.(ts|tsx|jsx)$/,
        exclude: /node_modules/,
        use: {
          loader: "babel-loader"
        }
      },
      {
        test: /\.(css)$/,
        exclude: /node_modules/,
        use: {
          loader: "css-loader"
        }
      }
    ]
  },
  resolve: {
    extensions: [".ts", ".tsx", ".js", "jsx", ".css"]
  },
  node: {
    __dirname: false,
    __filename: false
  }
};

module.exports = (env, argv) => {
  return config;
};