Creé una nueva aplicación Vue usando Vite a través npm init vue@latest . Agregué TailwindCSS al proyecto basado en la guía oficial .
Ejecutar npm run lint arroja errores
error 'módulo' no está definido no-undef
porque quiere que postcss.config.js y tailwind.config.js sean módulos ES (creo).
Al convertir postcss.config.js de
module.exports = { plugins: { tailwindcss: {}, autoprefixer: {}, }, };a
export const plugins = { tailwindcss: {}, autoprefixer: {}, };y tailwind.config.js de
module.exports = { content: ["./index.html", "./src/**/*.{vue,js,ts,jsx,tsx}"], theme: { extend: {}, }, plugins: [], };a
export const content = ["./index.html", "./src/**/*.{vue,js,ts,jsx,tsx}"]; export const theme = { extend: {}, }; export const plugins = []; y al ejecutar npm run dev la aplicación se bloquea con el error
[vite] Error interno del servidor: Complemento de 'exportación' de token inesperado: vite:css
¿Cómo soluciono este error de pelusa?
De hecho, puede mantener esos archivos de configuración como CommonJS. El env de ESLint debe establecerse en node en esos archivos de configuración porque Node es el entorno real durante la compilación.
Inserte este comentario en la parte superior de postcss.config.js y tailwind.config.js :
/* eslint-env node */env para *.config.js Configure overrides para configurar env para archivos *.config.js :
// .eslintrc.cjs module.exports = { ⋮ overrides: [ { files: ['*.config.js'], env: { node: true, }, }, ], }Si usa VS Code, es probable que deba reiniciar el servidor ESLint (o el IDE) para volver a cargar la configuración.
*.config.js Configure ignorePatterns para no borrar estos archivos de configuración:
// .eslintrc.cjs module.exports = { ⋮ ignorePatterns: ['*.config.js'], }Si usa VS Code, es probable que deba reiniciar el servidor ESLint (o el IDE) para volver a cargar la configuración.