Webpack - скомпилируйте два выходных пакета с различными путями активов - PullRequest
Новая
       6

Webpack - скомпилируйте два выходных пакета с различными путями активов

0 голосов
/ 22 января 2019

Я пытаюсь создать сайт с использованием веб-компонентов.Проблема в том, что мне нужны два разных пакета с разными путями к изображениям в CSS.Пути сохраняются в CSS-файлах и должны оставаться относительными.

Это линия сборки, которую я сейчас использую для создания секций CSS. 

...
test: /\.css|\.scss$/,
use: [
  {
    loader: 'polymer-css-loader',
    options: {
      minify: false
    }
  },
  'extract-loader',
  'css-loader',
  'postcss-loader',
  'sass-loader'
]
...

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

...
test: /\.(png|gif|jpg|svg)$/,
use: [
  {
    loader: 'file-loader',
    options: {
      name: 'static/images/[name].[ext]',
      emitFile: false
    }
  }
]
...

1 Ответ

0 голосов
/ 22 января 2019

Вы можете передать два конфига в веб-пакет и настроить загрузчик файлов в соответствии с вашими потребностями: 

    module.exports = [
        {
            entry: './example',
            output: {
                path: path.join(__dirname, "dist"),
                filename: 'app1.js'
            },
            module: {
                rules: [
                    {
                        test: /\.(png|gif|jpg|svg)$/,
                        use: [
                            {
                                loader: 'file-loader',
                                options: {
                                    name: 'static/images/[name].[ext]',
                                    emitFile: false
                                }
                             }
                         ]
                      }

       },

       {
           entry: './example',
           output: {
               path: path.join(__dirname, "dist"),
               filename: 'app2.js'
           },
           module: {
               rules: [
                   {
                       test: /\.(png|gif|jpg|svg)$/,
                       use: [
                           {
                               loader: 'file-loader',
                               options: {
                                   name: 'static/other/path/images/[name].[ext]',
                                   emitFile: false
                                }
                            }
                         ]
            }

         }
]

Подробнее https://github.com/webpack/webpack/tree/master/examples/multi-compiler

...