为什么Yeoman构建没有glyphicons？

Question

为什么Yeoman构建没有glyphicons？

deploymentfontsgruntjsyeoman

5

我正在开发一个 web 应用程序生成器，在运行 grunt 后，我得到了一个可以正确显示字体的功能性应用程序。然而，当我在 dist/ 目录中检查时，我没有获得任何字体文件。

文档说明 grunt 命令会“构建应用程序以进行部署”，但 dist/ 目录并不是自主的。

Gruntfile.js 配置

我的 copy:dist 任务如下：

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

它确实复制了字体，但没有复制位于bower_components/sass-bootstrap/dist/fonts/中的glyphicons字体。

构建内容

在运行grunt build后，这就是我得到的所有内容。

./dist
├── 404.html
├── favicon.ico
├── index.html
├── robots.txt
├── scripts
│   ├── coffee.js
│   ├── plugins.js
│   ├── vendor.js
│   └── main.js
└── styles
    └── main.css

问题

我该如何创建一个包含所有文件和资源的部署目录？

- Édouard Lopez

6个回答

5

Sindre提到的bug现在已经被修复。你可以使用 generator-webapp >= 0.4.2 开始一个新项目，或者手动应用这个补丁，只需要将一行新代码添加到复制任务中：

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

- passy

5

这是一个bug。目前最简单的方法就是手动复制到字体文件夹中。

- Sindre Sorhus

0

这对我有用 ;)

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

- cesar andavisa

0

使用根选项的cssmin将替换所有相对路径。

您可以在Gruntfile.js中禁用cssmin的根选项。

cssmin: {
  options: {
    //root: '<%= yeoman.app %>'
  }
},

- Eduardo Dennis

0

从 app/bower_components/bootstrap-sass-official/vendor/assets/fonts/bootstrap 复制字体

到 app/fonts

在 application.scss 中更改 $icon-font-path

从 $icon-font-path: "/bower_components/bootstrap-sass-official/vendor/assets/fonts/bootstrap/"

到 $icon-font-path: "/fonts/"

- Ant0ha

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Olger · Accepted Answer

看起来yeoman 1.1.2与上面的答案不兼容。

请修改Gruntfile.js并添加以下内容：

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

添加一个新区块，将字体从 bower 组件中复制到 dist 目录中。如果使用 sass 分发，请使用 sass-bootstrap 替换 bootstrap。