Можно ли динамически создать точку входа для каждой папки в конфигурации веб-пакета?

Question

Это моя текущая структура папок:

-- src
   -- js
      -- page 1
         -- index.js
         -- actions
         -- components
         -- reducers
      -- page 2
         -- index.js
         -- actions
         -- components
         -- reducers
      -- page 3
         -- index.js
         -- actions
         -- components
         -- reducers

И это мой webpack.config.js:

module.exports = {
    entry: {
        page1: './src/js/page1/index.js',
        page2: './src/js/page2/index.js',
        page3: './src/js/page3/index.js',
    },
    output: {
        path: './assets/javascripts',
        publicPath: '/assets/',
        filename: '[name].js'
    }
}

Поэтому каждый раз, когда я создаю новую страницу, я должен добавить еще одну строку в свой объект ввода. Это может стать очень большим и очень грязным.

Так есть ли способ просто сделать цикл веб-пакета по всем папкам в папке /src/js/ и автоматически сделать index.js в соответствующей папке точкой входа?

Спасибо за вашу помощь!

Answer 1

Используйте пакет glob:

const glob = require("glob");

const entry = glob.sync("src/js/**/*.js")
    .reduce((x, y) => Object.assign(x, {
        [y]: y,
    }), {});

module.exports = {
    entry,
    output: {
        path: './assets/javascripts',
        publicPath: '/assets/',
        filename: '[name].js'
    }
}

Это перебирает всю структуру вашей папки, захватывает каждый js-файл и добавляет его в хэш записи

Answer 2

Добавить к ответу выше моего, так как я не могу комментировать. С использованием path.basename Метод даст вам чистые, не вложенные имена файлов.

const glob = require("glob")
const path = require("path")

const entry = glob
    .sync("src/js/**/*.js")
    .reduce((acc, curr) => {
        return {...acc, [path.basename(curr, ".js")]: curr}
    })

module.exports = {
    entry,
    output: {
        path: './assets/javascripts',
        publicPath: '/assets/',
        filename: '[name].js'
    }
}

Answer 3

Вот как я сделал для вложенного каталога, используя glob: