Grunt 构建后无法加载 MDI 图标

Question

我已经通过 bower 安装了 LumX，并且运行正在 Yeoman angular-generator 上使用 g运行t。

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

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

我想这就是问题所在，因为 g运行t 缩小了，但它在开发中加载得很好。

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

谢谢！

Answer 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'
  }]
 }
}

Grunt 构建后无法加载 MDI 图标

Cannot load MDI icons after Grunt build

css

gruntjs

yeoman

yeoman-generator-angular

lumx