flutter error when importing custom font

2
votes

I try to install an icon as a custom font but whenever I try to run my app the console tells me that I got an error in the pubspec.yaml file. My font location is: myapp/fonts/icomoon.ttf and this is the relevant part of the pubspec.yaml file:

 fonts:
  - family:          icomoon
     fonts:
     -asset:        fonts/icomoon.ttf

and the error message I got is:

#/properties/flutter/properties/fonts/items/properties/fonts: type: wanted [array] got {-asset: fonts/icomoon.ttf} Error building assets for C:\Users\merli\Documents\Projects\WorkoutApp\myapp\build\app\intermediates\flutter\debug/app.flx

FAILURE: Build failed with an exception.

  • Where: Script 'C:\Users\merli\flutter\packages\flutter_tools\gradle\flutter.gradle' line: 441

  • What went wrong: Execution failed for task ':app:flutterBuildDebug'.

    Process 'command 'C:\Users\merli\flutter\bin\flutter.bat'' finished with non-zero exit value 1

  • Try: Run with --stacktrace option to get the stack trace. Run with --info or --debug option to get more log output.

  • Get more help at https://help.gradle.org

BUILD FAILED in 4s Finished with error: Gradle build failed: 1

4
gradlefontsdartyamlflutter
It might be caused by inconsistent indentation. Indentation in YAML matters. Check flutter.io/cookbook/design/fonts for how it should look like. - Günter Zöchbauer
See flutter.dev/docs/cookbook/design/fonts (and make sure you put the fonts: node under the top level flutter: node (and not, for example, under dependencies > flutter) - ccpizza

4 Answers

8
votes

Indentation and formatting is very important when working with YAML (as Gunther already mentioned in his comment). I ran your snippet of code through an online YAML parser and found 2 issues:

  • 1 extra space before fonts: that should not be there
  • -asset: needs an extra space to be - asset:. Otherwise for YAML it is just a string that happens to start with -

The error you received tells you that even though an array was expected for fonts, something else was encountered (the second item on the above list).

Here is the correct form I ended up with:

 fonts:
  - family:          icomoon
    fonts:
     - asset:        fonts/icomoon.ttf
0
votes

I was having the same behavior when I was trying to add Roboto font like this:

  fonts:
    - family: Roboto
      fonts:
        - asset: fonts/Roboto-Regular.ttf
        - asset: fonts/Roboto-Bold.ttf
        - weight: 700

I then realized that, I need to press the "Get packages" button (I'm using VSCode). So, once you add, make sure to click "Get packages" button.

0
votes

after adding your font assets, define it under the assets section of your pubspec.yaml,you should re build your project run flutter packages get ,firstly this worked for me..

-1
votes

flutter:

generate: true

uses-material-design: true

assets:

- assets/images/
- assets/go-logo.png
- assets/fb-logo.png

fonts:

- family: icomoon
    -asset icomoon.ttf
- family: Pacifico
    fonts
    -asset Pacifico-Regular.ttf