字體目錄問題

我試圖讓我的所有字體在我咕嚕生成後工作的問題。當我「咕嚕咕嚕」時，我的應用字體效果很好。字體目錄問題

問題是我的一些涼亭組件css文件使用字體的不同目錄比預期的咕嚕聲。

咕嚕想在app/styles/fonts/字體，如果他們是構建

我放在app/font自定義字體時被複制（我可以在我的主css所以不是一個大問題，改變這種）

@font-face { 
font-family: 'iec_unicoderegular'; 
src: url('../font/Unicode_IEC_symbol/Unicode_IEC_symbol.eot'); 
src: url('../font/Unicode_IEC_symbol/Unicode_IEC_symbol.eot?#iefix')

materialize.css想要的字體../font/roboto/和../font/material-design-icons

@font-face { 
font-family: "Roboto"; 
src: url("../font/roboto/Roboto-Thin.woff2") format("woff2"), 

@font-face { 
font-family: "Material-Design-Icons"; 
src: url("../font/material-design-icons/Material-Design-Icons.eot?#iefix") format("embedded-opentype"),

materialdesignicons.css希望在../fonts/

@font-face { 
font-family: 'MaterialDesignIcons'; 
src: url("../fonts/materialdesignicons-webfont.eot?v=1.0.62");

小號字體我不想更改CSS在涼亭的部件，而在那裏，我gruntfile.js的變化，可以把所有的字體源，然後將它們結合起來，以一種字體文件，並修改在構建期間的CSS來反映更改？如果不是處理這個問題的最好方法是什麼？我的gruntfile.js是未修改的。謝謝

來源

2015-05-27 COMPsmith

我絕不是專家。在遇到同樣的問題後我發現了你的問題。爲了完整性，我將在此列出所有步驟。

我安裝了roboto-fontface包帶涼亭：

bower install roboto-local --save

然後我跑

grunt build

這可以確保的Roboto-fontface CSS文件注入到我的index.html文件：

<link rel="stylesheet" href="bower_components/roboto-fontface/roboto-fontface.css" />

它也更新了dist目錄，所以我可以看到roboto字體的行動。

不幸的是，這些字體未被複制到我的dist目錄中。請注意，我確實有一個字體目錄，但這是用於引導字體的。我dist目錄是這樣的：

|-fonts 
    |-images 
    |-scripts 
    |-styles

的roboto-fontface CSS文件正在尋找在dist/styles/fonts/的字體：

@font-face { 
    font-family: 'Roboto'; 
    src: url('fonts/Roboto-Thin.eot'); 
    src: url('fonts/Roboto-Thin.eot?#iefix') format('embedded-opentype'), 
     url('fonts/Roboto-Thin.woff2') format('woff2'), 
     url('fonts/Roboto-Thin.woff') format('woff'), 
     url('fonts/Roboto-Thin.ttf') format('truetype'), 
     url('fonts/Roboto-Thin.svg#Roboto') format('svg'); 
    font-weight: 100; 
    font-style: normal; 
}

我決定最好的事情只是把字體那裏，不修改任何的CSS文件。我修改了copy dist規則Gruntfile.js加入：

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

此副本的一切的Roboto-fontface bower_components/roboto-fontface/fonts目錄裏面的樣式字體子目錄。

我新，和工作，dist目錄看起來像（注styles的font子目錄）

|-fonts 
    |-images 
    |-scripts 
    |-styles 
    |---fonts

我不知道哪兒來修改副本-dist的規則，因此對於完整性，這是我的全新規則：

// Copies remaining files to places other tasks can use 
copy: { 
    dist: { 
    files: [{ 
     expand: true, 
     dot: true, 
     cwd: '<%= yeoman.app %>', 
     dest: '<%= yeoman.dist %>', 
     src: [ 
     '*.{ico,png,txt}', 
     '.htaccess', 
     '*.html', 
     'images/{,*/}*.{webp}', 
     'styles/fonts/{,*/}*.*' 
     ] 
    }, { 
     expand: true, 
     cwd: '.tmp/images', 
     dest: '<%= yeoman.dist %>/images', 
     src: ['generated/*'] 
    }, { 
     expand: true, 
     cwd: 'bower_components/bootstrap/dist', 
     src: 'fonts/*', 
     dest: '<%= yeoman.dist %>' 
    }, 
    **{ 
     expand: true, 
     cwd: 'bower_components/roboto-fontface/', 
     src: 'fonts/*', 
     dest: '<%= yeoman.dist %>/styles/' 
    }**] 
    }, 
    styles: { 
    expand: true, 
    cwd: '<%= yeoman.app %>/styles', 
    dest: '.tmp/styles/', 
    src: '{,*/}*.css' 
    } 
},

來源

2015-08-25 11:50:14 Jack

字體目錄問題

回答

相關問題