Comments (13)
In multi page mode vue creates different objects for every 'page'
I noticed I have
'html-index' => [Object],
'html-app' => [Object],
rather than just html
changing the line
config.plugin("html").tap(args => {
to
config.plugin("html-index").tap(args => {
allows to the plugin to keep working, although I am unsure at what side effect problems it creates.
I suspect that if you want to prerender view from different pages the plugin will not work at this stage.
from vue-cli-plugin-prerender-spa.
I've occured same error when using pug template. I have /src/index.pug
file and no /src/public/index.html
file.
My config is as so:
pages: {
index: {
entry: './src/main.js',
template: './src/index.pug'
}
}
from vue-cli-plugin-prerender-spa.
When looking at code
`
if (process.env.NODE_ENV === "production") {
config.plugin("html").tap(args => {
args[0].template = api.resolve("public/index.html");
args[0].filename = "app.html";
return args;
});
}
There seems to be something hardcoded for index.html, but i don
t have that as you can see in my pages elements. Shouldn`t it use the template variable of vue config pages element ?
from vue-cli-plugin-prerender-spa.
I'm running into a similar issue. I converted my website to a multi page setup and this plugin stopped working in the same line.
I still have public/index.html but it still crashes for the same reason.
from vue-cli-plugin-prerender-spa.
Any update on this? The change above works but why is it needed?
from vue-cli-plugin-prerender-spa.
because the plugin expects your app to be under index. if you change your app name or have a multi page app, the plug n is unable the right webpack module? to process.
I don't know a lot about the webpack process so i can't give you a more precise answer.
But someone more knowledgable should create a pull request where we can pass this as a parameter in the config. or even better make the plug in handle multiple apps in one project.
from vue-cli-plugin-prerender-spa.
I'm really sorry I have not gotten any notifications for this (or any project I maintain or follow) in the past months, I'm sorry I've missed all of this.
Regarding multi-page setups, I don't really know how to approach this. I feel like this plugin was written too much with single-page in mind and don't really know how to proceed; should the plugin prerender all pages? One page only? How to make a selection of pages that is convenient enough.
I'm open to suggestions!
from vue-cli-plugin-prerender-spa.
Hi @SolarLiner no worries,
I am not sure how feasible my suggestion is but I think that vue cli parcels every page as its own object while processing in webpack.
In fact you should be able to refer to them using their key name in the config.
So in theory in the prerender config renderRouters we should be able to define pages as
[multi-page-keyname]/[name-of-route]
and you'll have enough information to render them.
Alternatively a nested dictionary
renderRoutes {
[multi-page-keyName] {
/[route]
}
}
from vue-cli-plugin-prerender-spa.
This sounds good to me - however what should be done when not all keys are defined in renderRoutes ?
from vue-cli-plugin-prerender-spa.
Not sure I understand your question but in renderroutes if a route is missing you do not render it? Don't think that changes as per current implementation.
Once you go the multi page route all pages must be defined ill post my current config as an example.
pages: {
index: {
entry: 'src/Website/main.js',
template: 'public/index.html',
filename: 'index.html',
title: 'Brandollo Website',
chunks: ['chunk-vendors', 'chunk-common', 'index']
},
plantool: {
entry: 'src/App/main.js',
template: 'public/app-index.html',
filename: 'app/index.html',
title: 'Brandollo App',
chunks: ['chunk-vendors', 'chunk-common', 'plantool']
},
},
So with the proposed changes renderroutes would look something like this
renderRoutes: [
"index/landing",
"index/product",
"plantool/free",
"plantool/other"
]
or
renderRoutes: {
index: [ "/alt",
"/product"] ,
plantool: ["/free"]
}
which ever is easier to implement :)
Thinking about it more I imagine a challenge would be to auto detect if the project is a single page or a multi page setup.
from vue-cli-plugin-prerender-spa.
Didnt work for me even after this change
config.plugin("html-index").tap(args => {
args[0].template = api.resolve("public/index.html");
from vue-cli-plugin-prerender-spa.
Any update?
#10
from vue-cli-plugin-prerender-spa.
I've occured same error when using pug template. I have
/src/index.pug
file and no/src/public/index.html
file.My config is as so:
pages: { index: { entry: './src/main.js', template: './src/index.pug' } }
yes I have the same issue as well ... any update?
from vue-cli-plugin-prerender-spa.
Related Issues (20)
- Meta information HOT 1
- Not working with vue cli 4.4 HOT 2
- Does it support with the route has params?
- Missing index.html when redirecting routes with vi18n HOT 2
- failed to launch chrome in heroku
- Missing the index.html and built dir is not correct too HOT 1
- FreeBSD Compatibility HOT 1
- index.html scripts get called twice
- How to remove the module HOT 4
- Error: Cannot call .tap() on a plugin that has not yet been defined. Call plugin('html').use(<Plugin>) first. HOT 6
- Prerender for router with webhash history mode
- How do you handle styles?
- Unable to prerender all routes!
- Meta Information HOT 2
- CI/CD Error: EACCES: permission denied, rmdir '/my-project/dist'
- e2e tests fail with latest vue-cli + vue-prerender-spa-plugin HOT 1
- Cannot set property 'execStart' of undefined
- Add server configuration options HOT 1
- Not triggered on different env? HOT 4
- Can't Submit form alway reloading when button click
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from vue-cli-plugin-prerender-spa.