Yeoman, Comment faire référence à une charmille paquet (font-awesome)?

Je suis totalement nouveau pour Yeoman et je suis confronté à un problème avec elle
après la mise en place de mon projet, j'ai décidé que je veux utiliser font-awesome
donc je l'ai installé à l'aide de bower et il fonctionne très bien

le problème est que font-awesome n'est pas dans la dist/bower_components dossier
mais quand je référence le fichier css de font-awesome dans la page html comme ceci

<link rel="stylesheet" href="bower_components/font-awesome/css/font-awesome.css">

il travaille en localhost, mais toujours pas de fichiers dans dist/bower_components sauf pour requirejs

alors, comment puis-je savoir grognement de copie de la police impressionnant de fichiers à la dist/bower_components dossier ?

OriginalL'auteur Muhammad Saleh | 2013-06-21

  1. 5

    Je voudrais utiliser Grunt-Contrib-Copie à copier ce dossier pour vous.

    Semble être une bonne solution, mais je veux comprendre l'ensemble du processus, de ne pas Yeoman et bower comprend le nécessaire(utilisés) des fichiers et de les ajouter automatiquement à la dist dossier ?
    Bower est juste un gestionnaire de paquets, c'est le seul travail est de tirer vers le bas ce que vous lui dites. Yeoman, vous donne à votre application la structure. Grunt, est le muscle, il déplace les choses pour vous. Donc, même si vous avez tiré vers le bas la police impressionnant des trucs avec des de verdure, vous avez encore à dire Grunt à se déplace pour vous.
    Merci je l'ai eu 🙂
    je l'ai fait aussi, je viens de regarder pour un peu plus de "sauce secrète" où seules les dépendances ont été copiés et non de l'ensemble du package d'installation.
    Alors je voudrais utiliser github.com/yatskevich/grunt-bower-task Il ne copie que les fichiers dans n'importe quel dossier que vous spécifiez. C'est essentiellement un grognement copie, mais avec moins de configuration manuelle.

    OriginalL'auteur Adam Simpson

  2. 2

    Également envisager l'utilisation de grunt-usemin pour aider à résoudre ce problème.

    index.html:

    <!-- build:css({.tmp,app}) styles/main.css -->
<link rel="stylesheet" href="bower_components/library/file.css">
<!-- endbuild -->

    Il pourrait prendre un peu d'effort pour obtenir que cela fonctionne, selon la version de Yo et le générateur vous avez utilisé à l'échafaud votre application.

    Noter que le cssmin:dist tâche a été désactivé par défaut maintenant, et l'ordre de vos construire des sous-tâches devrait ressembler à la dernière Gruntfile.

    L'avantage de cette solution est que vous n'avez pas à copier les fichiers source de bower_components. Grunt et Usemin reconnaîtra automatiquement le bloc, concaténer les fichiers, puis rapetisser dans un nouveau fichier, par opposition à plusieurs.

    Je pense que vous avez encore de copier ces fichiers de police? stackoverflow.com/questions/18222339/...

    OriginalL'auteur Stephen

  3. 1

    Il y a une assez complet de la discussion de la question dans cette stackoverflow répondre, mais encore, elle m'a pris un moment de piratage pour obtenir toutes les étapes de droit.

    D'abord si vous utilisez sass, d'inclure les polices-génial sur la partie supérieure:

    $fa-font-path: "../bower_components/font-awesome/fonts";
@import 'font-awesome/scss/font-awesome';

    Ce, les travaux étaient en cours d'exécution "grognement servir" mais les icônes ont disparu quand j'ai couru "grognement servir:dist'.

    Pour grunt build à dist, ajoutez la ligne suivante dans Gruntfile.js en vertu de la "copie" de la tâche:

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

    L'ensemble de votre "copie" de la tâche peut ressembler à quelque chose comme ceci (mon exemple):

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

    Puis " grognement servir:dist travaillées et les icônes affichées correctement. Espérons que cela sauve quelqu'un du temps!

    OriginalL'auteur Xuwen