Chrome Debugger - раздел «Нет домена», показывающий дублированные пути (после Webpack) - PullRequest
Новая
       19

Chrome Debugger - раздел «Нет домена», показывающий дублированные пути (после Webpack)

0 голосов
/ 10 сентября 2018

Сначала я добавлю картинку, так как она лучше всего объясняет ситуацию:

Chrome Debugger - After Webpack

Мой вопрос таков:

Пути, обведенные красным, действительно странные. Вот пример:

C: / Users /..../ Документы / Программирование / _actual-программы / HTML-CSS-JS / GitHub-страницы / name.github.io / SRC / C: / Users /.../ Документы / Программирование / _actual-программа / HTML-CSS-JS / GitHub-страница / name.github.io / SRC / C: / Users /.../ Документы / Программирование / _actual-программа / HTML-CSS-JS / GitHub-страница /name.github.io/src/C:/Users/.../Documents/Programming/_actual-programs/html-css-js/github-pages/name.github.io/src/styles.scss

Как видно, слева под (no domain) находятся тонны CSS файлов, и каждый файл имеет путь, повторенный несколько раз. Это не кажется правильным. Я считаю, что это связано с исходными картами для 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, чтобы вывод был правильным.

Любые мысли о том, что здесь происходит, будут высоко оценены.

EDIT:

У этого вопроса есть открытый вопрос здесь: https://github.com/webpack-contrib/css-loader/issues/652

...