как сделать предварительный рендеринг вэппака как вуэпресс сделать? - PullRequest
Новая
       33

как сделать предварительный рендеринг вэппака как вуэпресс сделать?

0 голосов
/ 25 мая 2019

как сделать предварительную визуализацию веб-пакета, как это делает vuepress?

я пытаюсь использовать prerender-spa-plugin но это показывает

vue.config.ts 

|  Building for production...Error: Failed to launch chrome!
[Prerenderer - PuppeteerRenderer] Unable to start Puppeteer

я тоже попробую посмотреть конфиг vuepress webpack https://github.com/vuejs/vuepress/tree/master/packages/%40vuepress/core/lib/node/webpack

но не могу этого понять

Мой тестовый проект создан с помощью

.
  • машинопись
  • eslint
  • бесполезный вавилон
  • @ vue / cli-plugin-pwa / register-service-worker 
{
  "name": "novel-site-v2",
  "version": "0.1.0",
  "private": true,
  "scripts": {
    "serve": "vue-cli-service serve",
    "build": "vue-cli-service build",
    "lint": "vue-cli-service lint",
    "test:unit": "vue-cli-service test:unit"
  },
  "dependencies": {
    "prerender-spa-plugin": "^3.4.0",
    "puppeteer": "^1.17.0",
    "register-service-worker": "^1.6.2",
    "vue": "^2.6.10",
    "vue-class-component": "^7.0.2",
    "vue-property-decorator": "^8.1.0",
    "vue-router": "^3.0.3",
    "vuex": "^3.0.1"
  },
  "devDependencies": {
    "@types/chai": "^4.1.0",
    "@types/mocha": "^5.2.4",
    "@types/node": "^12.0.2",
    "@types/webpack-chain": "^5.2.0",
    "@vue/cli-plugin-eslint": "^3.7.0",
    "@vue/cli-plugin-pwa": "^3.7.0",
    "@vue/cli-plugin-typescript": "^3.7.0",
    "@vue/cli-plugin-unit-mocha": "^3.7.0",
    "@vue/cli-service": "^3.7.0",
    "@vue/eslint-config-typescript": "^4.0.0",
    "@vue/test-utils": "1.0.0-beta.29",
    "babel-eslint": "^10.0.1",
    "chai": "^4.1.2",
    "eslint": "^5.16.0",
    "eslint-plugin-vue": "^5.0.0",
    "sass": "^1.18.0",
    "sass-loader": "^7.1.0",
    "typescript": "^3.4.3",
    "vue-template-compiler": "^2.5.21"
  }
}


import ChainWebpack from "webpack-chain";
import path from 'path'
import PrerenderSPAPlugin from 'prerender-spa-plugin'
//const Renderer = PrerenderSPAPlugin.PuppeteerRenderer

const production = process.env.NODE_ENV === 'production';
const development = !production;
let allowSourceMap = development;

export = {
    configureWebpack: {

        /*
        plugins: [
            new PrerenderSPAPlugin({
                staticDir: path.join(__dirname, 'dist'),
                routes: [
                    '/',
                    '/about',
                ],
                ignoreDefaultArgs: ['--disable-extensions'],
                renderer: new PrerenderSPAPlugin.PuppeteerRenderer({
                    inject: {
                        foo: 'bar'
                    },
                    headless: true,
                    ignoreDefaultArgs: ['--disable-extensions'],
                    renderAfterDocumentEvent: 'render-event'
                })
            })
            ,],
         */
    },

    chainWebpack(siteConfig: ChainWebpack)
    {
        const config = new ChainWebpack()

        /*
        siteConfig
            .plugin('prerender-spa-plugin')
            .use(PrerenderSPAPlugin, [
                {
                    staticDir: path.join(__dirname, 'dist'),
                    routes: [
                        '/',
                        '/about',
                    ],
                },
            ]);

         */
    },

};

у меня система windows 10

...