使用 grunt 构建项目时,Fontawesome 不起作用 [英] Fontawesome is not working when project is built with grunt

查看:34
本文介绍了使用 grunt 构建项目时,Fontawesome 不起作用的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我使用的字体库字体很棒.当项目不是用 grunt 构建/丑化时,它可以工作.

I'm using the font library font awesome. It works when the project is not built/uglified with grunt.

但是当我用 grunt 构建项目时,它不起作用.我在控制台中收到此错误:.../fonts/fontawesome-webfont.woff?v=4.0.3 404 (Not Found)

But when I'm building the project with grunt it's not working. I get this error in console: .../fonts/fontawesome-webfont.woff?v=4.0.3 404 (Not Found)

我已经与 yeoman 一起搭建了这个项目.

I've scaffolded the project with yeoman.

这是我在 index.html 中的引用

This is my ref in index.html

    <!-- build:css styles/fontawesome.css -->
    <link rel="stylesheet" href="bower_components/font-awesome/css/font-awesome.min.css">
    <!-- endbuild -->

有什么想法可能是错的吗?

Any ideas what can be wrong?

更新我需要将文件夹/bower_components/font-awesome/fonts 复制到 dist/fonts.这需要在 grunt 文件中完成.可能在复制"选项下

Update I need to copy the folder /bower_components/font-awesome/fonts to dist/fonts. This needs to be done in the grunt-file. Probably under the "copy" options

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

但我不确定在哪里包含它.

But I'm not really sure where to include this.

推荐答案

我遇到了同样的问题.以下代码解决了我的问题.

I had the same problem. The following code solved my problem.

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/bootstrap/dist', // change this for font-awesome
            src: ['fonts/*.*'],
            dest: '<%= config.dist %>'
        }]
    }
}

这篇关于使用 grunt 构建项目时,Fontawesome 不起作用的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆