打包时出现： Unable to prerender all routes

周三工作打包的时候，npm run build 还像往常工作一样打包给后端，然后周四我正常修改问题，准备打包给后端的时候，就发现一直打包不了，然后界面就显示一直在打包中，打了20分钟，30分钟都没成功，最后暴出问题：[prerender-spa-plugin] Unable to prerender all routes!

 试了好久，终于打包成功了

在\node_modules\@prerenderer\renderer-puppeteer\es6\renderer.js中第113行

await page.goto(`${baseURL}${route}`, navigationOptions);

改为：

 await page.goto(`${baseURL}${route}`, {...navigationOptions, timeout:0} );

然后在vue.config.js中的代码

const webpack = require('webpack')
const PrerenderSPAPlugin = require('prerender-spa-plugin');
const Renderer = PrerenderSPAPlugin.PuppeteerRenderer;
const path = require('path');

module.exports = {
    publicPath: '/',
    outputDir: 'dist',
    lintOnSave: process.env.NODE_ENV !== 'production',
    productionSourceMap: false,
    pwa: {},
    // webpack-dev-server 相关配置
    devServer: {
        open: process.platform === 'darwin',
        host: '0.0.0.0',
        port: 8080,
        https: false,
        hotOnly: false,
        proxy: {
            // '/api': {
            '/webapi': {
                // target: 'http://www.xxxxxxxxx', // 线上地址
                ws: true,
                changeOrigin: true,
            }
        }
    }, // 设置代理 l,,l]
    // before: app => {}
    configureWebpack: () => {
        const info = new webpack.ProvidePlugin({
            $: 'jquery',
            jQuery: 'jquery',
            'windows.jQuery': 'jquery'
        })
        if (process.env.NODE_ENV !== 'production') {
            return {
                plugins: [
                    info
                ],
            };
        } else {
            return {
                plugins: [
                    info,
                    new PrerenderSPAPlugin({
                   
                        // 生成文件的路径，也可以与webpakc打包的一致。
                        // 下面这句话非常重要！！！
                        // 这个目录只能有一级，如果目录层次大于一级，在生成的时候不会有任何错误提示，在预渲染的时候只会卡着不动。
                        staticDir: path.join(__dirname, 'dist'),
                        // 对应自己的路由文件，比如a有参数，就需要写成 /a/param1。
                        routes: ['/', '/home', '/partner/login', '/notFond'
                        ],
                        // 这个很重要，如果没有配置这段，也不会进行预编译
                        server: {
                            proxy: {
                                "/webapi": {
                                    target: "http://11.11.101.1",
                                    secure: false
                                }
                            }
                        },
                        renderer: new PrerenderSPAPlugin.PuppeteerRenderer({
                            inject: {
                                foo: 'bar'
                            },
                            navigationOptions: {
                                timeout: 0,
                            },
                            // renderAfterTime: 5000,
                            // headless: false,
                            // 在 main.js 中 document.dispatchEvent(new Event('render-event'))，两者的事件名称要对应上。
                            // renderAfterDocumentEvent: 'render-event'
                        })
                    })
                ],
            };
        }
    }
}

在main.js中

new Vue({
    router,
    store,
    render: h => h(App),
    mounted() {
        document.dispatchEvent(new Event('render-event'))
    },
}).$mount("#app");

然后在npm run build,就出现成功的提示了

Build complete. The dist directory is ready to be deployed.