feat(app generator): add HTML5 shim and 'respond.js' for IE8 support …

…of HTML5 elements and media queries
marviq · Apr 13, 2015 · df60e02 · df60e02
1 parent 1b94101
commit df60e02
Show file tree

Hide file tree

Showing 2 changed files with 14 additions and 3 deletions.
diff --git a/generators/app/index.js b/generators/app/index.js
@@ -68,7 +68,7 @@ module.exports = yeoman.generators.Base.extend(
         ,   {
                 name:       "ie8"
             ,   type:       "confirm"
-            ,   message:    "Do you need IE8 and lower support? (Affects the jQuery version)"
+            ,   message:    "Do you need IE8 and lower support? (affects the jQuery version and shims HTML5 and media query support)"
             ,   default:    false
             }
         ,   {

diff --git a/generators/app/templates/src/_index.template.html b/generators/app/templates/src/_index.template.html
@@ -30,10 +30,21 @@
     <title>#- _.slugify(packageName) -#</title>
     <meta name="description" content="#- _.slugify(packageDescription) -#">
 
-    <link rel="stylesheet" type="text/css" href="<%- styleUrl %>" /><% if ( debugging ) { %>
+    <link rel="stylesheet" type="text/css" href="<%- styleUrl %>" />#% if ( ie8 ) { %#<%
 
-    <script src="//localhost:35729/livereload.js"></script><% } %>
+    //
+    //  HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries.
+    //
+    //  NOTE: Respond.js doesn't work if you view the page via `file://`.
+    //
 
+    %>
+    <!--[if lt IE 9]>
+      <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
+      <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
+    <![endif]-->#% } %#<% if ( debugging ) { %>
+
+    <script src="//localhost:35729/livereload.js"></script><% } %>
 </head>
 <body>
     <div id="main-content"></div>