webpack 错误[prerender-spa-plugin] -无法预渲染所有路由

我在使用Laravel 5.7和Vue 2.6实现prerender-spa-plugin时遇到了一个问题：

Error: Child compilation failed:
  Entry module not found: Error: Can't resolve '/mnt/c/laragon/w  ww/<project-folder>/resources/views/index.html' in '/mnt/c/laragon/  www/<project-folder>':
  Error: Can't resolve '/mnt/c/laragon/www/<project-folder>/resources  /views/index.html' in '/mnt/c/laragon/www/<project-folder>'
  - compiler.js:79 childCompiler.runAsChild
    [<project-folder>]/[html-webpack-plugin]/lib/compiler.js:79:16
  - Compiler.js:343 compile
    [<project-folder>]/[webpack]/lib/Compiler.js:343:11
  - Compiler.js:671 hooks.afterCompile.callAsync.err
    [<project-folder>]/[webpack]/lib/Compiler.js:671:15
  - Hook.js:154 AsyncSeriesHook.lazyCompileHook
    [<project-folder>]/[tapable]/lib/Hook.js:154:20
  - Compiler.js:668 compilation.seal.err
    [<project-folder>]/[webpack]/lib/Compiler.js:668:31
  - Hook.js:154 AsyncSeriesHook.lazyCompileHook
    [<project-folder>]/[tapable]/lib/Hook.js:154:20
  - Compilation.js:1385 hooks.optimizeAssets.callAsync.err
    [<project-folder>]/[webpack]/lib/Compilation.js:1385:35
  - Hook.js:154 AsyncSeriesHook.lazyCompileHook
    [<project-folder>]/[tapable]/lib/Hook.js:154:20
  - Compilation.js:1376 hooks.optimizeChunkAssets.callAsync.err
    [<project-folder>]/[webpack]/lib/Compilation.js:1376:32
  - Hook.js:154 AsyncSeriesHook.lazyCompileHook
    [<project-folder>]/[tapable]/lib/Hook.js:154:20
  - Compilation.js:1371 hooks.additionalAssets.callAsync.err
    [<project-folder>]/[webpack]/lib/Compilation.js:1371:36
  - Hook.js:154 AsyncSeriesHook.lazyCompileHook
    [<project-folder>]/[tapable]/lib/Hook.js:154:20
  - Compilation.js:1367 hooks.optimizeTree.callAsync.err
    [<project-folder>]/[webpack]/lib/Compilation.js:1367:32
  - Hook.js:154 AsyncSeriesHook.lazyCompileHook
    [<project-folder>]/[tapable]/lib/Hook.js:154:20
  - Compilation.js:1304 Compilation.seal
    [<project-folder>]/[webpack]/lib/Compilation.js:1304:27
  - Compiler.js:665 compilation.finish.err
    [<project-folder>]/[webpack]/lib/Compiler.js:665:18
  - Compilation.js:1224 hooks.finishModules.callAsync.err
    [<project-folder>]/[webpack]/lib/Compilation.js:1224:4
  - Hook.js:154 AsyncSeriesHook.lazyCompileHook
    [<project-folder>]/[tapable]/lib/Hook.js:154:20
  - Compilation.js:1216 Compilation.finish
    [<project-folder>]/[webpack]/lib/Compilation.js:1216:28
  - Compiler.js:662 hooks.make.callAsync.err
    [<project-folder>]/[webpack]/lib/Compiler.js:662:17
  - Compilation.js:1148 _addModuleChain
    [<project-folder>]/[webpack]/lib/Compilation.js:1148:12
  - Compilation.js:1007 errorAndCallback.bail.err
    [<project-folder>]/[webpack]/lib/Compilation.js:1007:6
  - Compilation.js:1038 moduleFactory.create
    [<project-folder>]/[webpack]/lib/Compilation.js:1038:14
  - NormalModuleFactory.js:401 factory
    [<project-folder>]/[webpack]/lib/NormalModuleFactory.js:401:22
  - NormalModuleFactory.js:130 resolver
    [<project-folder>]/[webpack]/lib/NormalModuleFactory.js:130:21
  - NormalModuleFactory.js:224 asyncLib.parallel
    [<project-folder>]/[webpack]/lib/NormalModuleFactory.js:224:22
  - async.js:2830 
    [<project-folder>]/[webpack]/[neo-async]/async.js:2830:7
  - async.js:6877 
    [<project-folder>]/[webpack]/[neo-async]/async.js:6877:13

我正在关注Vue和Laravel实现部分的博客教程：https://vuejsdevelopers.com/2017/04/01/vue-js-prerendering-node-laravel/
然后设置我的webpack.config.js（在项目根文件夹上（从laravel-mix webpack.config.js内容中复制内容+教程中的代码））：

var path = require('path')
var webpack = require('webpack')
var HtmlWebpackPlugin = require('html-webpack-plugin')
var PrerenderSPAPlugin = require('prerender-spa-plugin')
var Renderer = PrerenderSPAPlugin.PuppeteerRenderer
/**
 * As our first step, we'll pull in the user's webpack.mix.js
 * file. Based on what the user requests in that file,
 * a generic config object will be constructed for us.
 */
let mix = require('./node_modules/laravel-mix/src/index');
let ComponentFactory = require('./node_modules/laravel-mix/src/components/ComponentFactory');
new ComponentFactory().installAll();
require(Mix.paths.mix());
/**
 * Just in case the user needs to hook into this point
 * in the build process, we'll make an announcement.
 */
Mix.dispatch('init', Mix);
/**
 * Now that we know which build tasks are required by the
 * user, we can dynamically create a configuration object
 * for Webpack. And that's all there is to it. Simple!
 */
let WebpackConfig = require('./node_modules/laravel-mix/src/builder/WebpackConfig');
module.exports = new WebpackConfig().build();
module.exports.plugins.push(
  new HtmlWebpackPlugin({
    template: Mix.paths.root('resources/views/index.html'),
    inject: false
  })
);
module.exports.plugins.push(
  new PrerenderSPAPlugin({
    staticDir: path.join(__dirname, 'dist'),
    routes: [ '/' ]
  })
);

它在./public文件夹上生成index.html，但内容与上面的错误类似。

好吧，我通过渲染较少的页面解决了这个问题。看起来有一个问题是连接不好，这在我的情况下是不可能的。所以我想，较少的页面渲染将解决这个问题，它为我做到了。
我在VueCLI中使用了Vuejs，所以我只是在Vueidonconfig.js中注解了几页，瞧，它成功了。
下面你可以找到我的vue.config.js

var PrerenderSpaPlugin = require('prerender-spa-plugin')
var path = require('path')
module.exports = {
  "transpileDependencies": [
    "vuetify"
  ],
  configureWebpack: config => {
    if (process.env.NODE_ENV !== 'production') return
    return {
      plugins: [
        new PrerenderSpaPlugin(
           // Absolute path to compiled SPA
          path.resolve(__dirname, 'dist'),
          // List of routes to prerender
          [ '/', 
            '/login',  
            '/whyRecruiters', 
            '/logoutinfo', 
            '/verifyemailinfo', 
            //'/deleteaccountinfo', 
          ],
        ),
      ]
    }
  }
}

展开查看全部

webpack 错误[prerender-spa-plugin] -无法预渲染所有路由

2条答案

相关问题

热门标签

最新问答