5

我正在开发一个webapp生成器，运行后grunt我得到了一个可以正确显示字体的功能应用程序。但是，当我签入dist/目录时，我没有得到任何字体文件。

文档说明了该grunt命令build the application for deployment，但该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/

构建内容

这是我跑步后得到的一切grunt build

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

问题

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

4

6 回答 6

12

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 发行版，请将 bootstrap 替换为 sass-bootstrap。

于 2014-03-18T13:14:36.280 回答
5

Sindre 提到的错误现已修复。您可以使用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
                ]
            }]
        }
    }
于 2013-09-06T22:28:02.623 回答
5

那是一个错误。现在最简单的方法是将它们手动复制到字体文件夹中。

于 2013-09-04T12:31:10.193 回答
0

带有 root 选项的 cssmin 替换所有相对路径。

您可以在 Gruntfile.js 中停用 cssmin 的 root 选项

cssmin: {
  options: {
    //root: '<%= yeoman.app %>'
  }
},
于 2014-07-19T17:21:00.360 回答
0

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

到应用程序/字体

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

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

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

于 2014-05-15T15:41:26.523 回答
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'
  }
},
于 2015-05-26T21:45:23.323 回答