yeoman generator font awesome

Question

나는 yeoman mobile-generator로 모바일 응용 프로그램을 만들었습니다.
이제 멋진 글꼴을 추가하고 싶습니다. this을 시도했지만 컴파일 프로세스에서 실제로 작동하지 않습니다. 작은 조언이나 경험은 위대 할 것입니다.

좋아, 정말 조금 명확하지 않습니다. 죄송합니다.
컴파일 프로세스가 작동하지만 콘솔에 404 글꼴이 없습니다.라는 메시지가 표시됩니다.
이 작업을 수행하는 좋은 방법이 무엇인지는 분명하지 않습니다. scss 파일에서 CSS를 작성하면 index.html의 .min.css가 "< - build : ... ->"또는 다른 이름으로 구현되었습니다.

주 .scss 파일에이 내용을 추가하면 글꼴을 찾을 수 없습니다.

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

그루트는 글꼴 파일을 복사하고 이름을 바꿉니다. 로 :

5a6b8fb8.FontAwesome 

Answer 1

좋아,
나는 this answer의 도움으로 이것을 고칠 수있을 것 같습니다. 정자와 멋진
설치된 글꼴 :

bower install --save font-awesome 

그런 다음 단순히 index.html을이 라인은 내 문제를 해결했습니다.

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

감사 @OddEssay 우리의 도움을 @bpaul!

Answer 2

SCS들을 @importing 것은 사물의 CSS 측을 담당,하지만 난 당신이 또한 브라우저에서 액세스 할 수있는 위치에 assests를 이동할 필요가 있다고 생각, 그래서 grunt-contrib-copy 완벽하게 일을 할 것입니다. 툴툴 거리는 소리가 https://github.com/cbas/grunt-rev는 글꼴 파일의 이름을 변경한다 레브처럼

copy: { 
     main: { 
     files: [ 
      {expand: true, cwd: '../bower_components/font-awesome/fonts', src: ['*.*'], dest: 'public/fonts'} 
       ] 
     } 

Answer 3

소리 : 그래서 당신의 웹 루트 같은 public 뭔가가있는 경우. Gruntfile에서 다음과 같이 찾으십시오.

// Renames files for browser caching purposes 
rev: { 
    dist: { 
    files: { 
     src: [ 
     '<%= yeoman.dist %>/styles/fonts/*' 
... 

글꼴 줄을 제거하면 괜찮습니다.