我在使用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,但是内容是上面的错误。
我有两个问题要问。
1)route.js中有多少条路由?2)是否有提供动态内容的路由?
我的vue.js应用也面临着同样的问题。当我在本地主机上运行“ npm run build”时,一切似乎都很好,但是当我在Ubuntu服务器上部署它时,同样的错误也随之闪烁。在预渲染spa插件npm页面上清楚地写着,如果您正在使用数百个页面,则预渲染器可以工作,但是需要花费一些时间才能完全预渲染您的网站。当路由提供动态内容时,可能会出现相同的问题。我的网站面临动态内容问题(十进制page)。
Check the screenshot from pre-render spa plug in
解决方案是什么?
[每次,当我更新网站上的任何内容时,我都必须运行npm run build 3-4次以预先渲染所有路由。因此,我只是在动态十进制数学页面上面临此问题。