css-loader / style-loader 的錯誤

Question

我在兩台不同的 PC 上遇到了一個問題。 對於我的項目，我為開發安裝了以下依賴項：(webpack webpack-cli @babel/core @babel/preset-env @babel/preset-react babel-loader css-loader style-loader html-webpack-plugin) 和反應和反應-dom。 當我嘗試在項目的任何組件中導入一些樣式表時，問題就來了，錯誤是： import api from ".../node_modules/style-loader/dist/runtime/injectStylesIntoStyleTag;js"; . 我有點困惑，因為我檢查了很多次自己完成的其他 webpack 配置，它們與我現在使用的相同。 你有什么建議？ 謝謝！

Answer 1

我有這個問題，似乎 webpack 不允許 styles css 文件的多個定義。 因此，為我解決問題的方法是從 angular.json 中的“樣式”中刪除 css 文件

    //....
    "architect": {
    "build": {
      "builder": "@angular-builders/custom-webpack:browser",
      "options": {
        "outputPath": "dist/app-name",
        "index": "src/index.html",
        "main": "src/app/main.ts",
        "polyfills": "src/app/polyfills.ts",
        "tsConfig": "tsconfig.json",
        "preserveSymlinks": true,
        "assets": [
          "src/client/img"
        ],
        "styles": [], //don't mention your styles.css here
        "scripts": [],
        //....

webpack.config.js 應該包括加載程序，它應該足夠了

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