Webpack 4 - Сохранить структуру папок для пакетов

Question

Я не могу сохранить структуру папок для моих выходных пакетов.

Я пытался использовать [path] заполнитель, но это не работает. Есть похожая тема, но она не отвечает на мой вопрос.

Я использую: Webpack 4.28.4 и Node v10.15.0.

Структура входной папки:

src
|  
+-- blog
|  |
|  +-- index.js
|  
+-- index.js

webpack.config.js:

  entry: {
    main: './src/index.js',
    blog: './src/blog/index.js'
  },
  output: {
    filename: '[path][name].[contenthash].js',
    path: path.resolve(__dirname, 'dist')
  },

На выходе я получил:

dist
|  
+-- [path]blog.c63bf8952b90c5e5ba3e.js
|  
+-- [path]main.9ad0ffac44f9e88f76ce.js

Но я ожидаю:

dist
|  
+-- blog
|  |
|  +-- blog.c63bf8952b90c5e5ba3e.js
|  
+-- main.9ad0ffac44f9e88f76ce.js

Примечание: я использовал [name] заполнитель для идентификации файлов, но, наконец, я его удалю.

Answer 1

Для тех, кто ищет решение

Только один, который я нашел, использует путь в качестве имени записи (возможно, существует какой-то плагин). как в ответе выше.

Я сделал простое преобразование массива, которое позволяет мне преобразовать путь к записям.

и теперь в конфигурации вашего веб-пакета вы можете:

      module.exports = {
    mode: 'production',
    entry: entries,
    output:{
        path: path.resolve(__dirname, 'static_compiled'),
        filename: "[name].js"
    },
    ...
}

Answer 2

Если вы измените name вашего входного блока, чтобы он был путем в вашем выходном каталоге, который вы хотели бы видеть, когда он будет выводиться, это поможет вам.

Например, если вы переименовали свою запись в блоге в blog/blog как показано ниже, когда webpack генерирует пакет и выводит его в выходной каталог, поскольку имя файла blog/blog, результат будет dist/blog/blog.[contenthash].js. Другой файл по-прежнему будетmain.[contenthash].js.

Это должно помочь вам:

 `entry: {
    main: './src/index.js',
    'blog/blog': './src/blog/index.js'
  },
  output: {
    filename: '[name].[contenthash].js',
    path: path.resolve(__dirname, 'dist')
  }`