Skip to content
This repository was archived by the owner on Apr 8, 2020. It is now read-only.
This repository was archived by the owner on Apr 8, 2020. It is now read-only.

[Clarification] Adding a font  #471

Description

@raberana

I will be using an external font (.ttf/.woff2) and I am wondering if I should include this to the webpack.config.vendor.js

In the template, there is an existing loader to handle .ttf/.woff2 files:

loaders: [
            { test: /\.(png|woff|woff2|eot|ttf|svg)(\?|$)/, loader: 'url-loader?limit=100000' },
            { test: /\.css(\?|$)/, loader: extractCSS.extract(['css']) }
        ]

It is not clear to me how webpack knows that the path of the files inside the vendor array in the entry section is located in the local node_modules folder (this is another question that I would be grateful if you also answer :) )

 entry: {
        vendor: [
            '@angular/common',
            '@angular/compiler',
            '@angular/core',
          ....
            'jquery',
            'font-awesome/css/font-awesome.css',
            'zone.js',
        ]
    }

So if I add this to the entry section, should I be pointing it to the correct path (to whatever folder I put the .ttf/.woff2 files)?
Or I should not use webpack for this and just reference it in my app.component.css like this below?

@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 300;
  src: local('Open Sans Light'), local('OpenSans-Light'), url(https://fonts.gstatic.com/s/opensans/v13/DXI1ORHCpsQm3Vp6mXoaTa-j2U0lmluP9RWlSytm3ho.woff2) format('woff2');
  unicode-range: U+0460-052F, U+20B4, U+2DE0-2DFF, U+A640-A69F;
}

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Fields

    No fields configured for issues without a type.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions