vue promotional page pre-rendered as PHP template problem
for the promotional page made with vue, the page after build has only one div tag, and the contents are all used in js files. The most important thing is that some pages need php variables to output some data, which is stateless, and asynchronous requests waste a request. You need to report some data directly to the page with php template, and load the data of all pages in one request.
try
use prerender-spa-plugin for pre-rendering, and the effect of data without php direct output on the page is OK. If the page needs php variable input data such as {$list} to get a list, the pre-rendered html will have no data.
attempts to configure externals to apply php output data as variables, but to no avail.
related codes
externals: {
pagedata: "pagedata"
},
// prerender-spa-plugin
plugins:[
new PrerenderSPAPlugin({
// Index.html is in the root directory.
staticDir: path.join(__dirname, "../dist"),
routes: ["/"],
// Optional minification.
minify: {
collapseBooleanAttributes: false,
collapseWhitespace: false,
decodeEntities: false,
keepClosingSlash: false,
sortAttributes: false
},
// renderer: new Renderer({
// renderAfterTime: 5000,
// })
})
]
// webpack vue {$user} PHP
data: {
haha:{$user.haha_balance},
balance:{$user.balance},
}
you need to get the variable data from the PHP template, and then the pre-rendering ignores these variables, but it can appear in the html of the final build.