Grunt (Yeoman， Grunt-usemin， Grunt-rev)："rev'ed"字体路径不会反映在我的 ..CSS？

Question

背景

我正在使用约曼网络应用程序来搭建我的前端。在grunt文件中，他们使用grunt rev和grunt usemin

Grunt rev将"rev"我的资产，Grunt usemin将更新资产路径。

---

问题

我有一个正在使用的网络字体。我把字体文件夹放在了我的styles目录中，如gruntfile.js（"styles/fonts/｛，/｝.*"）中所述。Grunt-service正确地显示了我的字体，但在我构建文件后，它就不再工作了，因为字体文件名前面加了一些奇怪的胡言乱语字符。例如：63b122ab.fontname.ttf而不是fontname.ttf

这是为了破坏缓存。但是我的.css文件没有更新路径来获取它。

在gruntfile.js 中的我的usemin块中

我该怎么办？我目前有这个，但它不起作用。

usemin: {
  options: {
    assetsDirs: ['<%= config.dist %>', '<%= config.dist %>/images', '<%= config.dist %>/styles/fonts']
  },
  html: ['<%= config.dist %>/{,/}.html'],
  css: ['<%= config.dist %>/styles/{,/}.css']
},

它会拾取其他所有东西，但不会拾取字体。我手动创建了字体文件夹。因此，我猜测gruntfile.js必须更新以反映变化。

Answer 1

我在css文件中遇到了同样的问题。我在Gruntfile.js中更改了usemin配置，如下所示：

usemin: {
  html: ['<%= yeoman.dist %>/<%= yeoman.client %>/{,!(bower_components)/**/}*.html'],
  css: ['<%= yeoman.dist %>/<%= yeoman.client %>/!(bower_components){,*/}*.css'],
  js: ['<%= yeoman.dist %>/<%= yeoman.client %>/!(bower_components){,*/}*.js'],
  options: {
    assetsDirs: [
      '<%= yeoman.dist %>/<%= yeoman.client %>',
      '<%= yeoman.dist %>/<%= yeoman.client %>/assets/images'
    ],
    // This is so we update image and font references in our ng-templates
    patterns: {
      js: [
        [/(assets/images/.*?.(?:gif|jpeg|jpg|png|webp|svg))/gm, 'Update the JS to reference our revved images']
      ],
      css: [
        [/(assets/images/.*?.(?:gif|jpeg|jpg|png|webp|svg))/gm, 'Update the CSS to reference our revved images'],
        [/(assets/fonts/.*?.(?:woff|ttf|svg|eot))/gm, 'Update the CSS to reference our revved fonts']
      ]
    }
  }
}