javascript - Chrome 调试器 - 显示重复路径的“无域”部分（在 Webpack 之后）

Question

我将首先附上一张图片，因为它最好地说明了这种情况：

我的问题如下：

红色圈出的路径真的很奇怪。这是一个例子：

C:/Users/..../Documents/Programming/_actual-programs/html-css-js/github-pages/name.github.io/src/C:/Users/.../Documents/Programming/_actual -programs/html-css-js/github-pages/name.github.io/src/C:/Users/.../Documents/Programming/_actual-programs/html-css-js/github-pages/name。 github.io/src/C:/Users/.../Documents/Programming/_actual-programs/html-css-js/github-pages/name.github.io/src/styles.scss

CSS如图所示，左边有很多文件，在下面(no domain)，每个文件都有重复多次的路径。这似乎不对。我相信这与 CSS 的源地图有关。

我的Webpack设置已sourceMap设置true为每个处理 CSS 的加载器（仅发布相关部分）：

    {
      test: /\.s?[ac]ss$/,
      exclude: /node_modules/,
      use: [
        isProduction
          ? MiniCssExtractPlugin.loader
          : {
              // creates style nodes from JS strings
              loader: 'style-loader',
              options: {
                sourceMap: true,
                // convertToAbsoluteUrls: true
              }
            },
        {
          // CSS to CommonJS (resolves CSS imports into exported CSS string in JS bundle)
          loader: 'css-loader',
          options: {
            sourceMap: true,
            importLoaders: 3
            // url: false,
            // import: false
          }
        },
        {
          loader: 'postcss-loader',
          options: {
            config: {
              ctx: {
                cssnext: {},
                cssnano: {},
                autoprefixer: {}
              }
            },
            sourceMap: true
          }
        },
        {
          loader: 'resolve-url-loader',
          options: {
            attempts: 1,
            sourceMap: true
          }
        },
        {
          // compiles Sass to CSS
          loader: 'sass-loader',
          options: { sourceMap: true }
        }
      ]
    },

如果我将sourceMap属性之一设置为false（例如postcss-loader），则路径不再像上面那样重复。

但是根据各种加载器文档，链上的每个加载器，从头到尾在 Webpack 配置中，必须设置true为输出正确。

对这里发生的事情的任何想法将不胜感激。

---

编辑：

这个问题在这里有一个未解决的问题：https ://github.com/webpack-contrib/css-loader/issues/652

标签： javascriptcsswebpacksource-mapswebpack-style-loader