【问题标题】: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."?如何解决“您好,时间旅行者。我们正处于无前缀 CSS 的黄金时代,您的样式表不再需要 Autoprefixer。”?
【发布时间】:2020-11-03 02:02:12
【问题描述】:
在我的 Next.JS 应用程序中,我将样式表导入 _app.js,如下所示:
import '../public/css/Index.css';
Index.css 包含以下内容:
.index-container {
margin: 20px auto 0;
}
如何解决错误信息:
./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/索引.css)
警告
你好,时间旅行者。我们正处于无前缀的黄金时代
CSS,您的样式表不再需要 Autoprefixer。
【问题讨论】:
标签:
javascript
css
next.js
autoprefixer
【解决方案1】:
这是由于browserslist 与postcss-preset-env 与v9.4.4 的捆绑版本之间的一些不兼容而导致的问题。
更新到v9.5.0 应该可以解决它。
【解决方案2】:
您的问题可以通过应用以下代码解决package.json:
"browserslist": {
"production": [
">0.3%",
"not ie 11",
"not dead",
"not op_mini all"
],
"development": [
"last 1 chrome version",
"last 1 firefox version",
"last 1 safari version",
">0.3%",
"not ie 11",
"not dead",
"not op_mini all"
]
}
完成这些更改后,重新启动服务器。您将不会再收到此警告。
【解决方案3】:
我必须按如下方式更改生产和开发项目,这很有效。
"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"
]
},