字体太棒了不能使用自动生成器推送到Heroku

Question

我正在使用Yeoman发电机"angular-fullstack".使用新生成的"angular-fullstack"脚手架,我执行一个 bower install --save components-font-awesome然后在main.html模板中添加一个字体 - 真棒图标,构建并将其推送到heroku,我看到一个灰色框,图标应该是.

但是,如果我在grunt serve本地执行,我可以看到我期望的图标.

我不知道这是一个Yeoman Angular-fullstack问题,grunt问题,字体真棒问题还是Heroku问题所以我把它扔出去了.也许有人可以帮助限制这一点.

注意:我使用"components-font-awesome"而不是"font-awesome",因为grunt不能正确构建字体,所以建议使用垫片.

我在本地服务时看到的内容:

我在构建并推送到heroku时看到的内容:

Answer 1

在这个版本的Yeoman angular-fullstack生成器中,该grunt build命令在dist目录下构建交付的文件.另一个stackoverflow答案(在上面的注释中引用)暗示将font-awesome fonts目录直接放在该dist级别下.但是,服务文件是在dist/public.因此,它位于public目录所在的fonts目录下,并且应该放置字体真棒字体文件.

为了使这与现有的工作grunt build,我预先将字体 - 真棒字体文件复制到app/fonts目录中.这样,grunt build自动将文件复制到dist/public/fonts目录中.

Answer 2

为了补充已接受的答案,以下是要走的路:

添加以下Gruntfile.js的copy.dist.files部分:

{ 
  expand: true,
  cwd: '<%= yeoman.app %>/bower_components/font-awesome', 
  src: 'fonts/*', 
  dest: '<%= yeoman.dist %>' 
}

我根据其他评论的建议创建了一个独特的答案.