如何在html文件中为每个块定义useminPrepare中的个别流？

gruntfile.js:

useminPrepare: {
        html: '<%= yeoman.app %>/index.html',
        options: {
            dest: '<%= yeoman.dist %>',
            flow: {
                html: {
                    steps: {
                        // TODO for libs.js block I don't want uglify!
                        js: ['concat', 'uglifyjs'], 
                        css: ['cssmin']
                    },
                    post: {}
                }
            }
        }
    }

小智.. 17

似乎您需要定义自定义块.将在示例中显示 - 仅使用concat创建自定义块"myjs".

Gruntfile.js

useminPrepare: {
  html: '<%= config.app %>/index.html',
  options: {
    dest: '<%= config.dist %>',
    flow: {
      // i'm using this config for all targets, not only 'html'
      steps: {
        // Here you define your flow for your custom block - only concat
        myjs: ['concat'],
        // Note that you NEED to redefine flow for default blocks... 
        // These below is default flow.
        js: ['concat', 'uglifyjs'],
        css: ['concat', 'cssmin']
      },
      // also you MUST define 'post' field to something not null
      post: {}
    }
  },
},

您还需要为自定义块定义块替换.这些块应与js相同.

Gruntfile.js:

usemin: {
  options: {
    assetsDirs: ['<%= config.dist %>', '<%= config.dist %>/images'],
    blockReplacements: {
      // our 'replacement block'
      myjs: function (block) {
        return '';
      }
      // no need to redefine default blocks
    }
  },
  html: ['<%= config.dist %>/{,*/}*.html'],
  css: ['<%= config.dist %>/styles/{,*/}*.css']
},

那么,现在您可以在index.html中使用新的自定义块:

现在它应该按照你的意愿工作.我还没有测试过这段代码,但是我的应用程序配置非常相似,它就像一个魅力.我在定义替换块方面也遇到了一些问题 - 这非常令人沮丧.

希望能帮助到你!