webpack - 如何使用 Barba.js 和 webpack 加载块？

Question

我正在使用 barba.js 为转换做一个 webpack 应用程序。我的块没有加载导航的应用程序，而是在应用程序加载时加载。

例如，如果我直接在此 url“localhost:8080/portfolio.html”上打开应用程序，则会读取“portfolio”块。但如果我在“portfolio”菜单链接上打开此页面（链接上的 event.preventDefault()点击），这个块没有加载。

为什么 ？

module.exports = {
    entry: {
        main: path.resolve(__dirname, '../src/script.js'),
        about: path.resolve(__dirname, '../src/js/about.js'),
        portfolioFunction: path.resolve(__dirname, '../src/js/portfolioFunction.js'),
    },
    output:
    {
        filename: 'bundle.[contenthash].js',
        path: path.resolve(__dirname, '../dist')
    },
    optimization: {
        splitChunks: {
          chunks: 'all',
        },
    },
    devtool: 'source-map',
    plugins:
    [
        new CopyWebpackPlugin({
            patterns: [
                { from: path.resolve(__dirname, '../static') }
            ]
        }),
        new HtmlWebpackPlugin({
            filename: 'index.html',
            template: path.resolve(__dirname, '../src/index.html'),
            chunks: ['main'] 
        }),
        new HtmlWebpackPlugin({
            filename: 'portfolio.html',
            template: path.resolve(__dirname, '../src/portfolio.html'),
            chunks: ['main', 'portfolioFunction'] 
        }),
        new HtmlWebpackPlugin({
            filename: 'about.html',
            template: path.resolve(__dirname, '../src/about.html'),
            chunks: ['main', 'about'], 
        }),
        new HtmlWebpackPlugin({
            filename: 'contact.html',
            template: path.resolve(__dirname, '../src/contact.html'),
            chunks: ['main'] 
        }),
        new MiniCSSExtractPlugin()
    ],

拜托，我需要帮助！谢谢

标签： webpackbarbajs