title: Problems generating source map files with current Gulp setup
body: <p>I have set up a <code>gulpfile.js</code> in my project. It's working pretty nicely mostly, except when it comes to generating source maps, especially for the <code>LESS</code> files it compiles to <code>CSS</code>.</p>
  
  <p>I have put together a <a href="https://gist.github.com/alisamii/a3cd6809bc13686f8c29" rel="nofollow">gist</a> which contains all the files in my gulp setup. Please note that other than the gulp file.js itself, all the other files are inside a directory called <code>tasks</code>.</p>
  
  <p>The problems I am having are that</p>
  
  <ol>
  <li>I had to disable the autoprefixer in development because the source maps that were being generated were invalid as the autoprefixer modified the original <code>CSS</code> file after the source maps were generated. To compensate, I have added mixins that add the vendor prefixes during development, and I have to disable those for development and enable the autoprefixer for the production environment.</li>
  <li>I am unable to generate a minified CSS file at all if I want source maps. The minification breaks the source maps.</li>
  <li>Although I have LiveReload set up, and the associated browser plugins, I cannot get the CSS to get auto-injected into the page as I am making changes.</li>
  </ol>
  
  <p>If anyone can help me structure my gulp file.js to work more efficiently and more effectively, I would appreciate it.</p>
  
  <p>Again, my <code>gulpfile.js</code> and associated tasks are in this <a href="https://gist.github.com/alisamii/a3cd6809bc13686f8c29" rel="nofollow">gist</a>.</p>