如何在grunt-usemin编译期间删除一些javascript [英] How do I remove some javascript during grunt-usemin compilation

问题描述

我有一些代码可以方便快捷地编写/测试代码，代码不属于我的生产代码（主要是嘲笑服务器，所以我只需要grunt服务器）。

这是两个部分，一个是如何删除脚本的一部分

  angular.module （'nglaborcallApp'，[
'ngCookies'，
'ngResource'，
'ngSanitize'，
'ngRoute'，
'server_mocks'，// Don' t在生产版本中需要这一行
'对话框'
  

]

，然后是一段需要消失的index.html

 < ;! -  build：js（{.tmp，app}）scripts / mocks / mocks.js  - > 
< script type ='text / javascript'> var Mocks = {};< / script> ; 
< script src ='scripts / mocks / jobs.js'>< / script> 
< script src ='scripts / mock.js'>< / script> 
 <！ -  endbuild  - > 
  

所以这可能是2个问题。在usemin文档中没有看到任何关于这个的东西，所以我猜测还有其他工具，但我不知道该工具的名称是什么。

另一种可能是我做错了，而不是注入这个模拟对象，我应该用grunt服务器来做。什么是其他人在做什么？

解决方案

好的，在寻找别的东西时偶然发现了答案，因为还没有人回应。下面是我如何解决它：

您获得 Grunt Preprocess with

  npm install --save- dev grunt-preprocess 
  

然后修改 GruntFile.js 像这样（这是一个角度项目，YMMV）

  module.exports = function（grunt）{
 grunt.loadNpmTasks（'grunt-preprocess'）; <  - 在文件顶部附近添加此行
  

将此行添加到子任务列表

 预处理：{
选项：{
内联：true，
上下文：{
 DEBUG：false 
} 
}，
 html：{
 src：[
'<％= yeoman.dist％> /index.html' ，
'<％= yeoman.dist％> / views / *。html'
] 
}，
 js：{
 src：'.tmp /concat/scripts/*.js'
} 
}，
  

修改你的注册任务（在文件的底部）像thils：

  grunt.registerTask（'build'，[
'clean：dist'，
'useminPrepare'，
'concurrent：dist'，
'autoprefixer'，
'concat'，
'preprocess：js' ，//从生产bu中删除DEBUG代码ilds 
'preprocess：html'，//从生产版本中删除DEBUG代码
'ngmin'，
'copy：dist'，$ b $'cdnify'，
' cssmin'，
'uglify'，
'rev'，
'usemin'
]）; 
  

然后修改您现有的JavaScript代码，如下所示：

  // @if DEBUG 
'server_mocks'，//不会包含在生产版本中
 // @endif 
  

和您现有的html代码如下所示：



 <！ -  @if DEBUG  - > 
< script src ='scripts / mock.js'>< / script> <！ - 不会包含在生产版本中 - > 
<！ -  @endif  - > 
  




I have code that makes it easy and fast to write/test code, that code does not belong in my production code (mostly it mocks out the server so I only need the grunt server).

Two parts to this, one is how to I remove parts of a script

angular.module('nglaborcallApp', [
'ngCookies',
'ngResource',
'ngSanitize',
'ngRoute',
'server_mocks',  // Don't want this line in the production build
'dialogs'

]

and then a section of index.html that needs to go away

<!-- build:js({.tmp,app}) scripts/mocks/mocks.js -->
<script type='text/javascript'>var Mocks = {};</script>
<script src='scripts/mocks/jobs.js'></script>
<script src='scripts/mock.js'></script>
<!-- endbuild -->

So this might be 2 questions. I don't see anything in the usemin documentation about this so I'm guessing there is some other tool, but I don't know what the name of that tool is.

The other possibility is I'm doing it wrong and rather than inject this mocking object, I should be doing it with the grunt server. What is everyone else doing?

解决方案

Ok, so stumbled on the answer while looking for something else and since no one had yet responded. Here is how I solved it:

You get a copy of Grunt Preprocess with

npm install --save-dev grunt-preprocess

Then you modify your GruntFile.js like so (this is for an angular project, YMMV)

module.exports = function (grunt) {
    grunt.loadNpmTasks('grunt-preprocess');      <-- Add this line near the top of the file

add this in your list of subtasks

    preprocess : {
        options: {
            inline: true,
            context : {
                DEBUG: false
            }
        },
        html : {
            src : [
                '<%= yeoman.dist %>/index.html', 
                '<%= yeoman.dist %>/views/*.html'
            ]
        },
        js : {
            src: '.tmp/concat/scripts/*.js'
        }
    },

Modify your registered tasks (at the bottom of the file) like thils:

grunt.registerTask('build', [
    'clean:dist',
    'useminPrepare',
    'concurrent:dist',
    'autoprefixer',
    'concat',
    'preprocess:js',  // Remove DEBUG code from production builds
    'preprocess:html',  // Remove DEBUG code from production builds
    'ngmin',
    'copy:dist',
    'cdnify',
    'cssmin',
    'uglify',
    'rev',
    'usemin'
]);

Then modify your existing javascript code something like this:

// @if DEBUG
'server_mocks',  // Won't be included in production builds
// @endif

and your existing html code something like this:

<!-- @if DEBUG -->
<script src='scripts/mock.js'></script>  <!-- Won't be included in production builds -->
<!-- @endif -->

这篇关于如何在grunt-usemin编译期间删除一些javascript的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！