title: Have Grunt generate index.html for different setups
body: <p>I'm trying to use Grunt as a build tool for my webapp.</p>
  
  <p>I want to have at least two setups: </p>
  
  <p><strong>I. Development setup</strong> - load scripts from separate files, without concatenation,</p>
  
  <p>so my index.html would look something like:</p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html&gt;
      &lt;head&gt;
          &lt;script src="js/module1.js" /&gt;
          &lt;script src="js/module2.js" /&gt;
          &lt;script src="js/module3.js" /&gt;
          ...
      &lt;/head&gt;
      &lt;body&gt;&lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p><strong>II. Production setup</strong> - load my scripts minified &amp; concatenated in one file,</p>
  
  <p>with index.html accordingly:</p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html&gt;
      &lt;head&gt;
          &lt;script src="js/MyApp-all.min.js" /&gt;
      &lt;/head&gt;
      &lt;body&gt;&lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>The question is, <em>how can I make grunt make these index.html's depending on the configuration when I run <code>grunt dev</code> or <code>grunt prod</code>?</em></p>
  
  <p>Or maybe I'm digging in the wrong direction and it would be easier to always generate <code>MyApp-all.min.js</code> but put inside it either all my scripts (concatenated) or a loader script that asynchronously loads those scripts from separate files?</p>
  
  <p>How do you do it, guys?</p>