Webpack 无法识别 css-loader，尽管它在配置中

Question

由于某种原因，webpack 无法识别 css-loader，尽管它已在配置中并已安装。这是我的 webpack.config.json

const path = require('path')

module.exports = {
  entry: './index.ts',
  module: {
    rules: [
      {
        test: /\.ts?$/,
        use: 'ts-loader',
        exclude: /node_modules/,
      },
      {
        test: /\.css$/,
        use: ["css-loader", "style-loader"],
        exclude: /node_modules/
      },
      {
        test: /\.scss$/,
        use: ["style-loader", "sass-loader"],
        exclude: /node_modules/
      }
    ],
  },
  resolve: {
    extensions: ['.ts', '.js', '.css'],
  },
  mode: "production",
  output: {
    filename: 'bundle.js',
    path: path.resolve(__dirname, 'dist'),
  },
}

这是我的index.ts导入：

import 'bulma/css/bulma'

最后，这是我的package.json：

{
  "name": "wasm-emulator",
  "version": "1.0.0",
  "description": "",
  "main": "webpack.config.js",
  "dependencies": {
    "bulma": "^1.0.2",
    "jszip": "^3.10.1",
    "ts-loader": "^9.5.1",
    "typescript": "^5.5.4"
  },
  "devDependencies": {
    "webpack": "^5.94.0",
    "webpack-cli": "^5.1.4",
    "css-loader": "^7.1.2",
    "sass": "^1.77.8",
    "sass-loader": "^16.0.1",
    "style-loader": "^4.0.0"
  },
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "author": "",
  "license": "ISC"
}

我不断收到此错误，表明尽管明确定义了加载程序，但未定义加载程序：

模块解析失败：意外字符“@”(1:0) 您可能需要适当的加载程序来处理此文件类型，目前没有加载程序 配置为处理该文件。请参阅https://webpack.js.org/concepts#loaders

我不确定发生了什么事，一切对我来说看起来都是正确的，是否有一些不明显的事情表明我做错了？

Answer 1

这真是愚蠢的事情。 🤦u200d♀️ 我排除了node_modules，但导入的css bulma 来自节点模块。当我从配置中删除

exclude: /node_modules/

后，它就起作用了！