0
326
VistasTailwindcss no funciona con NextJS 12. Características experimentales
Cuando se lanzó NextJS 12, enseñé a construir un proyecto con viento de cola.
mi paquete.json
{ "name": "test", "version": "0.1.0", "private": true, "scripts": { "dev": "next dev", "build": "next build", "start": "next start", "lint": "next lint" }, "dependencies": { "next": "12.0.1", "react": "^18.0.0-alpha-9c8161ba8-20211028", "react-dom": "^18.0.0-alpha-9c8161ba8-20211028" }, "devDependencies": { "autoprefixer": "^10.4.0", "eslint": "7", "eslint-config-next": "12.0.1", "postcss": "^8.3.11", "tailwindcss": "^2.2.19" } }archivo next.config.js
module.exports = { swcMinify: true, reactStrictMode: true, experimental: { concurrentFeatures: true, serverComponents: true, }, };y según la documentación de nextjs, tenemos que actualizar nuestro archivo _document.js
import { Html, Head, Main, NextScript } from "next/document"; export default function Document() { return ( <Html> <Head /> <body> <Main /> <NextScript /> </body> </Html> ); } estoy recibiendo este extraño error 
mi archivo global.css
@tailwind base; @tailwind components; @tailwind utilities;PERO , si elimino las funciones experimentales, solo funciona el archivo
al igual que
module.exports = { swcMinify: true, reactStrictMode: true, };Extraño, PERO funciona después de construir
·
Juan Pablo Isaza
1 Respuestas
Responde la pregunta0
Seguí exactamente las instrucciones de la página oficial .
- no funcionó en modo desarrollador (siguiente desarrollador)
- funcionó, sin embargo, en modo prod (siguiente compilación && siguiente inicio)
agregué swcMinify: true a mi next.config.js, ahora funciona en ambos modos.
Así que mi próximo cofig completo es ahora
/** @type {import('next').NextConfig} */ const nextConfig = { swcMinify: true, reactStrictMode: true, }; module.exports = nextConfig;
·
Juan Pablo Isaza
Denunciar
Responde la pregunta