6

After reading this post (recommended reading) about not using HTML5Shiv direct from source like (almost) everybody does, I'm trying to include the html5shiv.js in my app using Rails 3.2 Asset Pipeline.

I downloaded both minified and not-minified version of the javascript. The convention tells you to add third-party files into the vendors/assets folder. I have two questions now:

1) Which version (minified or not-minified) should I add to vendors/assets/javascrip folder?

2) Since it's a conditional reference <!--[if lt IE 9]>, how should I call the script?

I don't want to add it to the application.js manifest, because I want to keep it as a separate file and I want to use the condition. I'm kind of lost!

Any help would be very appreciated.

Thanks

Guillermo Guerini
  • 997
  • 2
  • 12
  • 22

2 Answers2

8

You can use the unminified version of the JS if you like, Rails will compress it in production mode through the pipeline.

To keep the shiv as a separate file you can give it it's own manifest by creating a html5.js (or whatever) in your /vendor/assets/javascripts/ directory. In that file require the html5shiv (I assume the manifest and script are in the same dir).

//= require html5shiv

or 

//= require html5shiv.min

And then include the manifest in your layout in the conditional block. In HAML something like:

== "<!--[if lt IE 9]>"
= javascript_include_tag 'html5'
== "<![endif]-->"

Remember to restart your app server before testing.

Blake Simpson
  • 1,078
  • 6
  • 10
  • I tried what you said, and the HTML generated is this: Both files have the same content and if I tried to access than using the ?body=1 the show empty. If I remove the ?body=1 they are shown ok. But when I try to rake assets:precompile, the html5shiv.js is not compiled and when I run the server in production mode, I get an error. What am I missing? – Guillermo Guerini Jul 05 '12 at 14:59
  • I guess my assets weren't being served. Now everything seems to work. Thank you very much. – Guillermo Guerini Jul 05 '12 at 15:26
  • 1
    Remember to add custom manifests to your precompile list in `config/environments/production.rb` It has instructions, but an example: `config.assets.precompile += %w[html5.js]` – Blake Simpson Jul 05 '12 at 15:27
  • 2
    why not use the haml syntax for ie conditionals `/[if lte IE7]`...? – pruett Aug 21 '12 at 17:43
1

Or you may use directly

/[if lt IE 9]
  %script{ src: "http://html5shim.googlecode.com/svn/trunk/html5.js", type: "text/javascript" }
gayavat
  • 18,910
  • 11
  • 45
  • 55