webpack——搭建多页面之 glob

glob 在 webpack 中对文件的路径处理非常之方便，比如当搭建多页面应用时就可以使用 glob 对页面需要打包文件的路径进行很好的处理

官方文档

npm install glob -save-dev

webpack.config.js / vue.config.js

const glob = require('glob')

try {
    entries = glob('src/pages/*/main.js', { sync: true })
} catch (err) {
    entries = []
    throw err
}
entries.forEach((file) => {
    const fileSplit = file.split('/')
    const pageName = fileSplit[2]
    let pageHtml = fileSplit.slice(0, 3).join('/') + '/index.html'
    console.log(pages);

    pages[pageName] = {
        entry: file,
        template: pageHtml,
        filename: `${pageName}.html`
    }
})

module.exports = { pages }

// pages 打印的内容
{
    one: {
        entry: 'src/pages/one/main.js',
        template: 'src/pages/one/index.html',
        filename: 'one.html'
    },
    two: {
        entry: 'src/pages/two/main.js',
        template: 'src/pages/two/index.html',
        filename: 'two.html'
    }
}