For questions please post on Stack Overflow and use the 'webpack' tag (http://stackoverflow.com/tags/webpack).
dependabot-preview[bot] on npm_and_yarn
chore(deps-dev): bump eslint fr… (compare)
dependabot-preview[bot] on npm_and_yarn
chore(deps-dev): bump typescrip… (compare)
sokra on npm_and_yarn
sokra on master
chore(deps-dev): bump eslint-pl… Merge pull request #12440 from … (compare)
sokra on master
fix(normal-module-factory): imp… add space use correct hook in deprecation… and 1 more (compare)
dependabot-preview[bot] on npm_and_yarn
chore(deps-dev): bump eslint-pl… (compare)
dependabot-preview[bot] on npm_and_yarn
import "./assets/css/base.css";
hello,
I am trying to load the fonts through vue.config.js. However I am not getting it.
scss
@include font-face(Lato, '/fonts/lato/latoThin', 100, normal, eot woff2 woff svg ttf);
vue.config.js
....
rules: [{
test: /\.(woff(2)?|ttf|eot|svg)(\?v=\d+\.\d+\.\d+)?$/,
use: [{
loader: 'file-loader',
options: {
name: 'lato/[name].[ext]',
outputPath: 'fonts/'
}
}]
},
if I remove the first slash from the source path, fonts/lato/latoThin
it loads the fonts, but in compile this error appears
* ./fonts/lato/latoThin.eot? in ./node_modules/css-loader/dist/cjs.js??ref--8-oneOf-3-1!./node_modules/postcss-loader/src??ref--8-oneOf-3-2!./node_modules/sass-loader/dist/cjs.js??ref--8-oneOf-3-3!./node_module
s/resolve-url-loader!./src/styles/global.scss
and put the bar back in the font path and it works - /fonts/lato/latoThin
Any solution?
Have you tried using the url-loader?
Not yet, I'll try
Encore
as it does almost everything I needed. That said, if memory serves me right, I think you may have to use the url-loader along with your other CSS loaders to fix paths in CSS.