Grunt 构建后无法加载 MDI 图标答案

【问题标题】：Cannot load MDI icons after Grunt buildGrunt 构建后无法加载 MDI 图标
【发布时间】：2016-01-14 17:13:06
【问题描述】：

我已经通过 bower 安装了 LumX，并且正在运行带有 grunt 的 Yeoman 角度发生器。

在 grunt build 后在开发上运行时，所有图标都正确显示。当我运行 grunt build 并提供 dist/ 文件夹时，所有图标源都通过 GET 抛出错误： /styles/fonts/包含任何字体文件?v=1.2.64

我知道一切都在 localhost 上运行，但似乎无法确定它为什么一直引用它。

我认为这就是 grunt 缩小后的问题所在，但它在开发中加载得很漂亮。

任何解释和解决方案将不胜感激！

谢谢！

【问题讨论】：

标签： css gruntjs yeoman yeoman-generator-angular lumx

【解决方案1】：

在修补之后，我发现这是因为 Grunt 缩小的方式导致了 MaterialDesignIcons 的关闭。由于图标包有一个希望在特定路径 ../style/fonts/* 中找到它们的字体的源，因此在 Grunt 构建之后它不会相同，因为它们被缩小到一个文件中。

我对 Grunt 文件采用了 FontAwesome 方法。

copy: {
  dist: {
    files: [{
      expand: true,
      dot: true,
      cwd: '<%= config.app %>',
      dest: '<%= config.dist %>',
    src: [
      '.{ico,png,txt}',
      '.htaccess',
      'images/{,/}.webp',
      '{,/}.html',
      'styles/fonts/{,/}.'
      ]
     },{
   expand: true,
   dot: true,
   cwd: 'bower_components/mdi/fonts/',
   src: ['.'],
   dest: '<%= yeoman.dist %>/styles/fonts'
  }]
 }
}

【讨论】：