Nuxt with vite gives this error. This version of postcss-preset-env is not optimised to work with PostCSS 8.

[UrchenkoV]

Nuxt with vite gives this error.

This version of postcss-preset-env is not optimised to work with PostCSS 8.    
Please update to version 7 of PostCSS Preset Env.  

"dependencies": {
    "@nuxtjs/auth-next": "^5.0.0-1624817847.21691f1",
    "@nuxtjs/axios": "^5.13.6",
    "@nuxtjs/i18n": "^7.2.0",
    "@nuxtjs/proxy": "^2.1.0",
    "chart.js": "^3.7.1",
    "chartjs-adapter-moment": "^1.0.0",
    "core-js": "^3.15.1",
    "moment": "^2.29.1",
    "nuxt": "^2.15.7",
    "vue-multiselect": "^2.1.6",
    "vuelidate": "^0.7.7",
    "vuetify": "^2.5.5",
    "vuex-persistedstate": "^4.1.0"
  },
  "devDependencies": {
    "@nuxt/postcss8": "^1.1.3",
    "@nuxtjs/vuetify": "^1.12.1",
    "autoprefixer": "^10.4.2",
    "eslint-config-prettier": "^8.3.0",
    "nuxt-purgecss": "^1.0.0",
    "nuxt-vite": "^0.3.5",
    "postcss": "^8.4.12",
    "postcss-import": "^14.0.2",
    "postcss-nested": "^5.0.6",
    "prettier": "^2.3.2",
    "tailwindcss": "^3.0.19"
  }

How fixer?

[erisvn]

same

[tintin10q]

What should we do?

[hay-kot]

I also had this issues, didn't find the direct cause, but a stop-gap between upgrading to Nuxt bridge was to revert to v0.2.3. Seems to be working for now.

[Asef00]

Same here with Nuxt2.

[fafamnzm]

same here! I even remove vuetify, and axios modules and still get this error in repeat!
didn't find any solution for it

[simonmaass]

can so confirm... any update here?

[eugenioclrc]

same here...

[Ahmard]

You can get rid of the warning by installing postcss-preset-env version 7.

[dasfmi]

did you find a solution for this error?

[nwittwer]

Reason this error is occurring: Run yarn why postcss-preset-env

=> Found "[email protected]"
info Reasons this module exists
   - "nuxt-vite" depends on it
   - Hoisted from "nuxt-vite#postcss-preset-env"
   - Hoisted from "nuxt#@nuxt#webpack#postcss-preset-env"

And if you check the nuxt-vite package.json:

vite/package.json

Line 36 in 20559a0

"postcss-preset-env": "^6.7.0",

And the core reason this message shows up: postcss-preset-env 6.7.1 release notes:

Added notice when using preset-env with PostCSS > 7 to prompt to upgrade.

A PR to update this postcss-preset-env for nuxt-vite is here: #231

Workaround

You can add the resolutions (Yarn)/overrides (NPM) to your package.json so that it specifically uses the postcss-preset-env 7.x version. After doing this the error is gone and as far as I can tell nothing breaks.

You DO NOT need to add postcss-preset-env as a dependency of your own project (it is already installed by nuxt-vite).

Yarn docs: resolutions
NPM docs: overrides

package.json (Yarn example)

{
  ...
  "resolutions": {
    "postcss-preset-env": "^7.0.0"
  },
  "dependencies": {
    "nuxt-vite": "0.3.5"
  },
  ...
}