rsnext/packages/next/build/webpack/config/blocks/css/messages.ts
Hannes Bornö bf8ee1edb4
Add support for font loaders (#40746)
For some context:
[https://vercel.slack.com/archives/CGU8HUTUH/p1662124179102509](https://vercel.slack.com/archives/CGU8HUTUH/p1662124179102509)

Continuation of #40221 and #40227

Adds `experimental.fontLoaders`.

SWC next-font-loaders (#40221) transforms font loader (e.g. #40227) call
expressions into an import with the function call arguments as a query.

The imports will be matched by `next-font-loader`. It runs the
configured font loaders - emits font files and returns CSS. Exports are
added, and the font-family is made locally scoped. The returned CSS is
turned into a CSS module with `css-loader` which lets you consume the
font-family.

`FontLoaderManifestPlugin` creates a manifest of the preloaded font
files for each entrypoint. Preload/preconnect are then added in
`_document.tsx` if any font files were found for that path.

Co-authored-by: JJ Kasper <jj@jjsweb.site>
2022-09-21 22:12:59 -07:00

39 lines
1.3 KiB
TypeScript

import chalk from 'next/dist/compiled/chalk'
export function getGlobalImportError() {
return `Global CSS ${chalk.bold(
'cannot'
)} be imported from files other than your ${chalk.bold(
'Custom <App>'
)}. Due to the Global nature of stylesheets, and to avoid conflicts, Please move all first-party global CSS imports to ${chalk.cyan(
'pages/_app.js'
)}. Or convert the import to Component-Level CSS (CSS Modules).\nRead more: https://nextjs.org/docs/messages/css-global`
}
export function getGlobalModuleImportError() {
return `Global CSS ${chalk.bold(
'cannot'
)} be imported from within ${chalk.bold(
'node_modules'
)}.\nRead more: https://nextjs.org/docs/messages/css-npm`
}
export function getLocalModuleImportError() {
return `CSS Modules ${chalk.bold(
'cannot'
)} be imported from within ${chalk.bold(
'node_modules'
)}.\nRead more: https://nextjs.org/docs/messages/css-modules-npm`
}
export function getCustomDocumentError() {
return `CSS ${chalk.bold('cannot')} be imported within ${chalk.cyan(
'pages/_document.js'
)}. Please move global styles to ${chalk.cyan('pages/_app.js')}.`
}
export function getFontLoaderDocumentImportError() {
return `Font loaders ${chalk.bold('cannot')} be used within ${chalk.cyan(
'pages/_document.js'
)}.`
}