Recibo este error cada vez que ejecuto npm start. Probé un par de arreglos pero ninguno de ellos funcionó para mí. Intenté cambiar la versión de autoprefixer a 9.8.6 pero no funcionó. por favor ayudame con este problema
Este es mi paquete.json
{ "name": "reactgallery", "version": "0.1.0", "private": true, "dependencies": { "@testing-library/jest-dom": "^4.2.4", "@testing-library/react": "^9.5.0", "@testing-library/user-event": "^7.2.1", "react": "^16.13.1", "react-dom": "^16.13.1", "react-scripts": "3.4.3" }, "scripts": { "start": "npm run watch:css && react-scripts start", "build": "npm run build:css && react-scripts build", "test": "react-scripts test", "eject": "react-scripts eject", "build:css": "postcss src/assets/tailwind.css -o src/assets/main.css", "watch:css": "postcss src/assets/tailwind.css -o src/assets/main.css" }, "eslintConfig": { "extends": "react-app" }, "browserslist": { "production": [ ">0.2%", "not dead", "not op_mini all" ], "development": [ "last 1 chrome version", "last 1 firefox version", "last 1 safari version" ] }, "devDependencies": { "autoprefixer": "^9.8.6", "postcss-cli": "^7.1.2", "tailwindcss": "^1.8.10" } }Es simple,
npm install postcss@^8Funcionó muy bien para mí.
Instale postcss como una dependencia.
npm i postcssNo estoy seguro de esto, pero ¿puede intentar instalar postcss como una dependencia?
npm i postcssRebaje su autoprefixer a la versión 9, use
"prefijador automático": "^9.0.0"
en sus dependencias dev.
PostCSS se actualizó a la versión 8, sin embargo, PostCSS CLI aún no se ha actualizado para manejar los complementos de PostCSS que usan la nueva API de PostCSS 8+. Autoprefixer utiliza la nueva API PostCSS 8 desde la versión 10.
Esto está documentado en problemas conocidos en la página PostCSS GitHub.
Una vez que la CLI de PostCSS se actualice para manejar los complementos que usan la nueva API de PostCSS 8+, es probable que esto no sea un problema. Pero hasta entonces, es posible que deba degradar algunos complementos de PostCSS para evitar errores.
Ok, para mí se arregló eliminando package-lock.json e instalando:
"tailwindcss": "^1.8.10" "postcss-cli": "^7.1.0" "autoprefixer": "^9.7.5"Uso de la corrección de la solución oficial para la compilación de compatibilidad con PostCSS 7
yarn remove tailwindcss postcss autoprefixer yarn add -D tailwindcss@npm:@tailwindcss/postcss7-compat @tailwindcss/postcss7-compat postcss@^7 autoprefixer@^9Estos pasos funcionaron para mí. Esto fue de github
npm uninstall tailwindcss postcss autoprefixer npm install tailwindcss@latest postcss@latest autoprefixer@latest npx tailwindcss init -p npm uninstall tailwindcss postcss autoprefixer npm install tailwindcss@npm:@tailwindcss/postcss7-compat postcss@^7 autoprefixer@^9"dependencies": { "autoprefixer": "^9.8.6", "postcss": "^8.0.0", "postcss-cli": "^8.1.0", "tailwindcss": "npm:@tailwindcss/postcss7-compat@^2.0.2", }, El objeto y la versión de las dependencias se pueden modificar directamente en el archivo package.json y funciona
el siguiente combo funciona a partir de octubre de 2020
... "dependencies": { "autoprefixer": "^9.8.6", "postcss-cli": "^8.1.0", "tailwindcss": "^1.9.2" }Según el enlace de la documentación, se elimina algo de soporte para NodeJS antiguo y debe actualizar manualmente los paquetes. Ejemplo en mi caso para un proyecto basado en webpack solo necesita actualizar esas dependencias:
"dependencies": { "autoprefixer": "^10.0.2", "postcss": "^8.1.7", "postcss-loader": "^4.0.4" }Por lo tanto, no necesita degradar el autoprefixer :)
Para Next.js 10 solo tienes que hacer
npm install tailwindcss@latest postcss@latest autoprefixer@latestFuente Este número aquí
Si tiene este problema y está utilizando Tailwind CSS v2, intente esto
npm uninstall tailwindcss postcss autoprefixer npm install tailwindcss@npm:@tailwindcss/postcss7-compat postcss@^7 autoprefixer@^9fuente:https://tailwindcss.com/docs/installation#post-css-7-compatibility-build
Tuve este problema con Laravel-mix 5 y PostCSS 8 y Tailwind 2.
Con Laravel-mix 6 (beta por el momento) esto se solucionó.
npm install laravel-mix@next --save-dev