angular-cli-ghpages: Deployed site: Uncaught SyntaxError: Unexpected token <
After building the site with:
ng build --prod --base-href "https;//<username>.github.io/<reponame>/
I can run the site with no issues on a local server.
However, after publishing via ngh
, the online site just gives the following error 4 times:
SyntaxError: Unexpected token < (index):1
No other errors or information is given, so I have no idea what to do.
About this issue
- Original URL
- State: closed
- Created 7 years ago
- Comments: 18 (5 by maintainers)
I was facing the same issue .This is due the creation of project directory inside the dist folder which is not being pointed by index.html. Fixed it by changing the base tag from
<base href="/">
to<base href="/project-app/">
inside index.html file.From my understanding, github pages require a
_config.yml
file, so the project structure I uploaded had to look like the following:Until I had
_config.yml
, the site would constantly fail with the error in the original post. It worked as soon as the file was present.Inside
_config.yml
I specified the base URL:baseurl: /ng2-parallaxscroll
Here’s the full project, check the
origin/docs
branch for the website source, and thegh-pages
for the built output: https://github.com/TyrantWave/ng2-parallaxscrollTo add the
_config.yml
to the output, I added it to theangular.cli.json
assets folder:Ok, so the issue was by default angular doesn’t have the
_config.yml
file, which took a lot of digging around to find out was needed.@JohannesHoppe I have resolved the issue. I moved
app.listen(process.env.PORT || 8080);
before all definitions ofapp.use
and routes.Which config file? Could you explain your solution in detail?! 😄
I bet this is related to you heroku deployment. Did you added the static pages buildpack? (https://github.com/heroku/heroku-buildpack-static). You could also go for a full SSR solution (express, see https://angular.io/guide/universal) This is what we do for https://angular-buch.com and https://angular.schule . Heroku automatically adds the buildpack for node.js.
This worked for me. Thanks
I am having this same issue with an app hosted on heroku. Works perfectly on my local system but remote builds on heroku throws the same error. A look at the generated .js files (vendor.hash.js, main.hash.js, inline.hash.js, scripts.hash.js & polyfills.hash.js) in the console shows HTML elements in the generated files.