npm install next-fontsImport fonts in Next.js
(woff, woff2, eot, ttf, otf & svg)
```
npm install --save next-fonts
or
``
yarn add next-fonts
Create a next.config.js in your project
`js`
// next.config.js
const withFonts = require('next-fonts');
module.exports = withFonts();
Optionally you can add your custom Next.js configuration as parameter
`js`
// next.config.js
const withFonts = require('next-fonts');
module.exports = withFonts({
webpack(config, options) {
return config;
}
});
You can serve remote resources by setting _assetPrefix_ option.
Example usage:
`js`
// next.config.js
const withFonts = require('next-fonts');
module.exports = withFonts({
assetPrefix: 'https://example.com',
webpack(config, options) {
return config;
}
});
You can also (optionally) include SVG fonts by setting _enableSvg_ option.
Example usage:
`js`
// next.config.js
const withFonts = require('next-fonts');
module.exports = withFonts({
enableSvg: true,
webpack(config, options) {
return config;
}
});
Example usage:
`js``
// next.config.js
const withFonts = require('next-fonts')
module.exports = withFonts({
inlineFontLimit: 16384,
webpack(config, options) {
return config
}
})
Please see https://github.com/rohanray/next-fonts-example for usage with Nextjs v9.2+
Please see https://github.com/rohanray/next-fonts-example/tree/master/with-styled-comp for sample code to use with styled components. Live URL : https://type-error-idfldxadbv.now.sh