How do I solve “Greetings, time traveller. We are in the golden age of prefix-less CSS, where Autoprefixer is no longer needed for your stylesheet.”?

11
votes

In my Next.JS app I import my stylesheet in _app.js like this:

import '../public/css/Index.css';

Index.css contains this:

.index-container {
    margin: 20px auto 0;
}

How do I solve the error message:

./src/public/css/Index.css (./node_modules/css-loader/dist/cjs.js??ref--5-oneOf-5-1!./node_modules/next/dist/compiled/postcss-loader??__nextjs_postcss!./src/public/css/Index.css) Warning

Greetings, time traveller. We are in the golden age of prefix-less CSS, where Autoprefixer is no longer needed for your stylesheet.

4
javascriptcssnext.jsautoprefixer

4 Answers

10
votes

Your issue can be solved package.json by applying code below:

"browserslist": [">0.3%", "not ie 11", "not dead", "not op_mini all"]
5
votes

I had to change both production and dev items as follows and this worked.

"browserslist": {
  "production": [
    ">0.3%",
    "not ie 11",
    "not dead",
    "not op_mini all"
  ],
"development": [
    ">0.3%",
    "not ie 11",
    "not dead",
    "not op_mini all"
  ]
},
2
votes

This was an issue due to some incompatibility between browserslist and the bundled version of postcss-preset-env with v9.4.4.

Updating to v9.5.0 should solve it.

0
votes

Updating all installed packages sovled the issue.