Comments (11)
Hi,
You are using html imports that are basically not handled by PhantomJS. So I'm afraid you will have to use an other technique to load your html file for the plugin to work.
If the concerned html file is not important for your prerendering, you can try to just ignoreJSErrors: true
in the plugin options (see documentation)
from prerender-spa-plugin.
I found the problem in my index.html file
<script>
var link = document.querySelector('link[rel=import]');
var content = link.import.querySelector('.svg-sprite');
document.head.appendChild(content.cloneNode(true));
</script>
from prerender-spa-plugin.
After I commented those out, I got error like this:
/Users/gordon/workspace/CrewGuru/crewguru-web-ng2/node_modules/prerender-spa-plugin/lib/compile-to-html.js:80
if (error) throw stdout
^
WARNING: JavaScript error while prerendering: /home
TypeError: undefined is not an object (evaluating '(_a = ((Object))).assign.apply')
phantomjs://code/phantom-page-render.js:26 in onError
What did I do wrong this time?
from prerender-spa-plugin.
Hi,
There are many features that are not supported by PhantomJS. HTML imports are one of them. But also many es6 features.
Please try to add core-js polyfill like putting :
<script src="https://cdnjs.cloudflare.com/ajax/libs/core-js/2.4.1/core.min.js"></script>
At the top of your head
.
Or, if you're using CommonJS syntax, just npm install core-js
then require('core-js');
in your main document.
from prerender-spa-plugin.
Hi @jnrdt , thank you very much for the suggestions. I am not very clear about all the concepts though. We simply have a angular2 project (Typescript) created using angular-cli, which I believe uses WebPack. How do I tell if we are using ES6 or CommonJS?
from prerender-spa-plugin.
Hi,
Webpack typically can use CommonJS as dependency system. Typescript is a superset of es6 so you will have to do something to make your app work on old browsers (or poor browsers like PhantomJS use in this plugin)
You can just tell Typescript to produce a transpiled code that can work on old browsers. Under the hood, it will use core-js as polyfill. So you can, without any action on Typescript, just inject
<script src="https://cdnjs.cloudflare.com/ajax/libs/core-js/2.4.1/shim.min.js"></script>
In the head of your document (see the official doc)
from prerender-spa-plugin.
i get almost the same error:
undefined is not an object (evaluating 'modules[moduleId].call')
can't find anything similar… still a polyfill issue? i tried including core-js allthough its supposed to be included already.
anybody has a clue/fix?
from prerender-spa-plugin.
Hello @max-schu !
Errors like those can happen when you have a dependency written in ES6 (perhaps in an ill-maintained Vue plugin module?).
The resulting code is not transpiled by babel into ES5 before PhantomJS tries to evaluate it.
Perhaps try to alter your webpack.config.js
like so:
// ....
// rest of webpack config
// ...
module: {
rules: [
// ... other rules
{
test: /\.js$/,
loader: 'babel-loader',
include: [
path.join(__dirname, 'src'),
path.join(__dirname, 'node_modules', 'vue-offending-plugin'), // <--- FORCE transpile this module
],
exclude: path.join(__dirname, 'node_modules')
},
// .. the rest of your rules
]
},
// ....
// rest of webpack config
// ...
from prerender-spa-plugin.
Going to close until @max-schu comes back to help debug.
from prerender-spa-plugin.
sorry for not getting back quicker.
I fixed it by adding babel-polyfill. So i think either your solution or polyfilling helps.
from prerender-spa-plugin.
Thanks for the info!
from prerender-spa-plugin.
Related Issues (20)
- Plugin creates broken HTML HOT 1
- Puppeteer Issues on Oracle Linux 8 HOT 2
- Optimization of Puppeteer
- I have a Vue multi-page app, after prerender, all html files look the same. HOT 1
- render each route to an html file
- Only two pages are getting pre-rendered properly
- How to cache the result.
- docker
- on Safari and ios it doesn't always work
- [prerender-spa-plugin] Unable to prerender all routes! HOT 4
- How to configure puppeteer inside prerender-spa for Heroku
- How to launch puppeteer with { args: ['--no-sandbox'] }?
- "/" page flashing before routes load
- Unexpected token '?' with plugin only HOT 2
- Looking for maintainers! HOT 15
- Error during building example app: probably smth with websocket errno: -4039, code: 'ETIMEDOUT'
- Vue Prerender-SPA / Webpack - Application won't initialise with named cacheGroups unless explicitly listed in pages config chunks section?
- why no such file or directory
- Unable to prerender all routes! HOT 2
- Page refresh twice
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 prerender-spa-plugin.