В чем проблема с путями картинок webpack 4?

Question

[bra1nf00d]

Ошибка возникла после обработки файлов scss.
Проблема заключается в путях, то как картинка вставляется в html, не подходит для файлов css
Я пытался изменять имя, в момент выгрузки файлов, но опять же.

Подскажите, как можно решить данную проблему, не прибегая к url-loader

Я работаю с webpack-dev-server, при старте папка проекта очищается, ссылаться ему некуда

Рабочая ссылка в стилях:


Нерабочая:


---

Рабочий путь в html:


Нерабочий:


Вебпак:

/* IMG */
{
    test: /\.(png|jpe?g|gif|svg)$/,
      use: [
    {
      loader: 'file-loader',
      options: {
        name: `img/${filename('[ext]')}`,
        esModule: false,
        publicPath: ''
      }
    }
  ],
},

Answer 1

[bra1nf00d]

Я нашёл решение.
В плагин mini-css-extract-plugin, можно передать опции publicPath: '../'
На выходе я получаю кастомизированный путь в .scss, и сохраняю прежний путь в html

{
test: /\.(s[ac]ss|css)$/,
        use: [
          {loader: MiniCssExtractPlugin.loader, options: {publicPath: '../'} },
          {loader: 'css-loader'},
          {loader: 'sass-loader'},
        ]
},