Что делают эти конкретные символы в загрузчике Webpack? Ошибка модуля не найдена при обновлении

avatar
Lukas Udstuen
8 августа 2021 в 17:24
48
1
0

Я занимаюсь обновлением веб-сайта с Webpack1 до Weback3, и у меня возникли проблемы с переводом загрузчика scss в формат Webpack 3 из-за следующей строки:

    css?-autoprefixer&sourceMap!postcss?parser=postcss-scss!sass?sourceMap'

Я понял, что для перевода этой строки в Webpack3 мне нужно добавить суффикс "-loader" к одному из элементов, например, "css" становится "css-loader".

Я даже могу заставить сайт скомпилироваться, если уберу последнюю половину строки и включу только "css-loader", но стиль домашней страницы нарушен. По какой-то причине, если я включу весь раздел исходной карты, он не скомпилируется с ошибкой «ОШИБКА в модуле ввода не найдена: ошибка: не удается разрешить« css ?-autoprefixer & sourceMap »»

Исходным загрузчиком в Webpack 1 был:

     loaders: [
          {
            loader: ExtractTextPlugin.extract('style-loader', 'css?-autoprefixer&sourceMap!postcss?parser=postcss-scss!sass?sourceMap'),
            test: /\.scss$/
          },

В Webpack 3 я перевел его на:

    {
        test: /\.scss$/,
use: ExtractTextPlugin.extract({
          fallback: 'style-loader',
       use: [require.resolve('css-loader?-autoprefixer&sourceMap!postcss-loader?parser=postcss-scss!sass-loader?sourceMap'), require.resolve('sass-loader')]
        })
      },

Если кто-нибудь может подсказать, как обойти эту ошибку, когда модуль не найден, я был бы очень признателен. Я часами просматривал документацию и гуглил, и я не могу найти четкого руководства относительно того, что означают все символы соединителя в строке (! = ? &) или почему он теперь возвращает модуль, не найденный. Module not found error

Источник

Ответы (1)

avatar
Lukas Udstuen
5 апреля 2022 в 14:31
0

Символы относятся к встроенным загрузчикам. Из документации:

Можно указать загрузчики в операторе импорта или любом эквивалентном методе "импорта". Отделяйте загрузчики от ресурса знаком !. Каждая часть разрешается относительно текущего каталога.

импортировать стили из 'style-loader!css-loader?modules!./styles.css'; Можно перезаписать любые загрузчики в конфигурации с помощью предваряя все правило !.

Параметры могут быть переданы с параметром запроса, например. ?ключ=значение&foo=бар, или объект JSON, например. ?{"ключ":"значение","foo":"бар"}.

https://webpack-3.cdn.bcebos.com/concepts/loaders/#inline