Объедините несколько точек входа Webpack в один файл с помощью загрузчика файлов - PullRequest
Новая
       11

Объедините несколько точек входа Webpack в один файл с помощью загрузчика файлов

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

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

Но я также хочу связать мои css-файлы.Они также не зависят друг от друга, поэтому в коде CSS не используется правило импорта.Только многопользовательская запись в веб-пакете.Для этого я использую файл-загрузчик.Но в итоге я получаю отдельные файлы, или последний перезаписывает первый.

Упрощение моего кода 

webpack({
  entry: [
    './jsFileA.js',
    './jsFileB.js',
    './cssFileA.css',
    './cssFileB.css'
  ],
  output: {
    path: './',
    filename: 'bundle.js'
  },
  module: {
    rules: [{
      test: /\.css$/,
      use: [{
        loader: css-loader
      }, {
        loader: style-loader
      }, {
        loader: 'file-loader',
        options: {
          name: 'bundle.css'
        }
      }]
    }]
  }
}, (error, stats) => {
  console.log(stats);
})

В результате получится файл bundle.css, содержащий только CSS последнегоCSS-файлПервый get перезаписывается вторым.Если я использую [хэш] в имени файла, например name: '[hash].css', я получаю два файла css.

Так что, похоже, загрузчик файлов не объединяет несколько основных точек входа.Так работает загрузчик файлов?Или можно использовать загрузчик файлов и связать несколько основных точек входа?

1 Ответ

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

Используйте css-loader (https://github.com/webpack-contrib/css-loader) для пакета). Поскольку webpack является модулем JS, он не понимает CSS изначально.

...