Generate HTML files for AngularJS with Grunt

Question

We're developing a website with AngularJS, and would like to have static HTML files for every AngularJS page for search engines.

The site is small and static, about 10-20 pages.

Is there any task in grunt that can generate HTML files based on Angular app? E.g. it generates /static/about.html for /#about page of Angular app.

I saw services and scripts like PhantomJS, but they look too complicated for our case. As the site is static, we can run the task every time we're going to publish any changes.

Answer 1

PhantomJS is indeed the way to go. However, there is existing tools that do mostly what you want.

This one is a good example:

https://github.com/cburgdorf/grunt-html-snapshot

This will run PhantomJS through pages of your website and generate an HTML version of it. It can be automated via Grunt.

The only caveat is that you have to enter manually, in the configuration, all the pages you need to index.

Is it ok for what you need?

EDIT: This is also a quite interesting and complete article about SEO friendly Angular applications: http://www.ng-newsletter.com/posts/serious-angular-seo.html

They provide a few alternatives depending on your needs