De forma predeterminada, NextJS inyectará etiquetas <style> en línea dentro de la cabeza en desarrollo (posiblemente usando style-loader debajo del capó).

En el modo de producción, NextJS extraerá fragmentos de css y los servirá como archivos css separados del directorio _next/static . Depuré la configuración del paquete web NextJS sirve de manera predeterminada y noté que usa mini-css-extract-plugin debajo del capó para lograr este comportamiento.

El problema es que, para mis necesidades, necesito que NextJS también inyecte estilos en línea en producción. ¿Cuál es la forma más fácil de lograr esto?

Aquí está el next.config.js actual que uso

 const nextConfig = { useFileSystemPublicRoutes: false, poweredByHeader: false, assetPrefix: '', webpack(config) { console.dir(config.module.rules, { depth: null, colors: true }); config.module.rules.push({ test: /\.svg$/, use: ['@svgr/webpack'], }); return config; }, }; module.exports = nextConfig;