-
Notifications
You must be signed in to change notification settings - Fork 634
Style attribute binding gets overridden by pre-rendering #107
Comments
Great idea! I'm currently working on an adaptor of this that employs Chrome Headless via puppeteer instead of phantomJS, so we'll soon have more robust API's as that matures. In terms of what you can do right now to solve this issue, consider using <div class="foo" style="transform: translate3d(0, 0, 1);"> ... </div>
<!-- ➡️ -->
<div class="foo">... </div>
// Manually transform the HTML for each page after prerendering,
// for example to set the page title and metadata in edge cases
// where you cannot handle this via your routing solution.
//
// The function's context argument contains two properties:
//
// - html :: the resulting HTML after prerendering)
// - route :: the route currently being processed
// e.g. "/", "/about", or "/contact")
//
// Whatever is returned will be printed to the prerendered file.
postProcessHtml: function (context) {
var titles = {
'/': 'Home',
'/about': 'Our Story',
'/contact': 'Contact Us'
}
return context.html.replace(
/<title>[^<]*<\/title>/i,
'<title>' + titles[context.route] + '</title>'
)
} Hope that helps. Cheers. |
sounds good, thanks for the tip! |
@drewlustro I'm not 100% sure yet, but this seems to be a problem for |
What is problematic? This plugin is supposed to render static, vanilla HTML.
|
no, sorry, I'm not sure I should be the one closing issues 😛 |
I build a simple "parallax" using vuejs style binding
:style
and I found out that the prerender-spa-plugin executed phantomjs, which added static inline styles (eg.style="-webkit-transform: translateY(0px);"
) which, once generated, overrides the actual style-binding of the app.For this reason I would maybe propose the possibility of skipping inline-style attributes when pre-rendering the application...would that be easy to implement, or: does someone could point me towards a (good) solution to work around this issue?
The text was updated successfully, but these errors were encountered: