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;
}