Amazing font generator

I created a mobile application with a Yeoman mobile generator.

Now I want to add an awesome font. I tried this one , but it really does not work during the compilation process. A little advice or experience would be great.

Well, that is a little obscure. I'm sorry.

The compilation process works, but the console says 404 is not found for fonts.

I don’t quite understand how to do this. Having created CSS from scss files, I executed .min.css in index.html using "<- build: ... →" or something else ?!

When I add this to my main .scss file, the fonts will not be found.

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

Soil copies and renames fe to font files:

5a6b8fb8.FontAwesome
0
3

,
, .
:

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 !

+2

grunt rev https://github.com/cbas/grunt-rev . - Grunt:

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

, .

+2

@importing scss takes care of the CSS side of things, but I think you also need to move the pharmacies to a location that the browser can access them, so grunt-contrib-copy will do the job perfectly. So if your website is publicsomething like:

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

Source: https://habr.com/ru/post/1542217/


All Articles