grunt-preprocess and grunt-env mystery

Question

我在這一塊上敲了敲頭;

我想根據開發環境或生產來改變我的html文件。我在Stackoverflow上關注了一個主題，但不知怎的，預處理上下文參數總是文件中的最後一個參數。好的，我會包含一些片段。 Grunt.js的

件

//Grunt task to automate environment configuration for future tasks. 
    env : { 
     //USER : 'raymond', 
     //PATH : '/bin:/usr/bin', 

     options : { 
      /* Shared Options Hash */ 
      //globalOption : 'foo' 
     }, 
     dev: { 
      NODE_ENV : 'DEVELOPMENT' 
     }, 
     prod : { 
      NODE_ENV : 'PRODUCTION' 
     } 
    }, 
    //Grunt task around preprocess npm module. 
    preprocess : { 
     options: { 
      context : { 
       DEBUG  : true, 
       now   : '<%= grunt.template.today() %>',//@TODO .toISOString() 
       ver   : '<%= pkg.version %>' 
      } 
     }, 
     dev : { 
      options : { 
       context : { 
        url   : 'http://www.<%= pkg.name %><%= pkg.tld.dev %>', 
        concat  : '<%= pkg.name %><%= pkg.tld.dev %>.concat.js', 
        uglify  : '<%= pkg.name %><%= pkg.tld.dev %>.concat.min.js', 
        css   : '<%= pkg.name %><%= pkg.tld.dev %>.css', 
        cssMin  : '<%= pkg.name %><%= pkg.tld.dev %>.min.css' 
       } 
      }, 
      src : 'index.html', 
      dest : 'dist/dev/index.html' 
      // @TODO write to dist/dev-directory fails cause probably permissions checked it; 
      // I have to 777 on www-data to run Nginx properly. Strange cause raymond is part of group www-data 

     }, 
     prod : { 
      options : { 
       context : { 
        url   : 'http://www.<%= pkg.name %><%= pkg.tld.prod %>', 
        concat  : '<%= pkg.name %><%= pkg.tld.prod %>.concat.js', 
        uglify  : '<%= pkg.name %><%= pkg.tld.prod %>.concat.min.js', 
        css   : '<%= pkg.name %><%= pkg.tld.prod %>.css', 
        cssMin  : '<%= pkg.name %><%= pkg.tld.prod %>.min.css' 
       } 
      }, 
      src : '<%= preprocess.dev.src %>', 
      dest : 'dist/prod/index.html' 
     } 
    }, 

源的index.html

<!-- @if NODE_ENV == 'DEVELOPMENT' --> 
    <script type="text/javascript" src="/js/vendor/jquery-2.1.0.js"></script> 
    <script type="text/javascript" src="/js/vendor/jquery.hammer-1.0.6.js"></script> 
    <script type="text/javascript" src="/js//vendor/snap.svg-0.2.0.js"></script> 
    <script type="text/javascript" src="/js/vendor/helper.js"></script> 
    <script type="text/javascript" src="/js/plugins.js"></script> 
    <script type="text/javascript" src="/js/myradon.js"></script> 
    <script type="text/javascript" src="/js/myradon-snap.js"></script> 
    <!-- 
    <script src="<!-- @echo url -->/js/<!-- @echo concat -->"></script> 
    <script src="<!-- @echo url -->/js/<!-- @echo uglify -->"></script> 
    --> 
    <!-- @endif --> 
    <!-- @if NODE_ENV == 'PRODUCTION' --> 
    <!-- <script src="<!-- @echo url -->/js/<!-- @echo concat -->"></script> --> 
    <script src="<!-- @echo url -->/js/<!-- @echo uglify -->"></script> 
    <script> 
     var _gaq = _gaq || []; 
     _gaq.push(['_setAccount', 'UA-5427260-3']); //www.myradon.net = UA-5427260-2, www.myradon.nl = UA-5427260-3, www2.myradon.net = UA-5427260-4 
     _gaq.push(['_trackPageview']); 
     (function() { 
      var ga = document.createElement('script'); 
      ga.type = 'text/javascript'; 
      ga.async = true; 
      ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js'; 
      var s = document.getElementsByTagName('script')[0]; 
      s.parentNode.insertBefore(ga, s); 
     })(); 
    </script> 
    <!-- @endif --> 
</body> 

這是得到由預處理呈現的index.html的輸出：開發;

<!-- <script src="http://www.myradon.net/js/myradon.net.concat.js"></script> --> 
    <script src="http://www.myradon.net/js/myradon.net.concat.min.js"></script> 
    <script> 
     var _gaq = _gaq || []; 
     _gaq.push(['_setAccount', 'UA-5427260-3']); //www.myradon.net = UA-5427260-2, www.myradon.nl = UA-5427260-3, www2.myradon.net = UA-5427260-4 
     _gaq.push(['_trackPageview']); 
     (function() { 
      var ga = document.createElement('script'); 
      ga.type = 'text/javascript'; 
      ga.async = true; 
      ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js'; 
      var s = document.getElementsByTagName('script')[0]; 
      s.parentNode.insertBefore(ga, s); 
     })(); 
    </script> 
</body> 

正如你可以看到@if NODE_ENV ==「發展」被忽略，但是從預處理上下文參數：開發被傳遞給@If NODE_ENV ==「生產」這真的是沒有SENCE給我。你有線索嗎？！

Answer 1

好的傢伙我使用Grunt-processhtml。它完全符合我的想法。你可以在上下文中設置變量。移除HTML塊，根據envirenment設置url或元標記innerHTML非常好。唯一的缺點是，可能有一個設置，它留下處理html代碼的html-comment-markup。

Answer 2

我不知道它的問題，但是我用單一的「=」每例如就像在： grunt-preprocess on npm

<!-- @if NODE_ENV='production' --> 
<script src="some/production/lib/like/analytics.js"></script> 
<!-- @endif -->