Gatsby插件设置-postcss+自动重定位器+浏览列表
Gatsby插件设置-postcss+自动重定位器+浏览列表
提问于 2020-05-11 14:59:11
我的目标是让gatsby-plugin-postcss在gatsby build期间为我的CSS文件设置所有浏览器前缀。从docs中，首选的方法是在gatsby构建过程中使用browserslist，并在postcsss中使用自动重定位器。
我的gatsby-config.js
const autoprefixer = require("autoprefixer");
const browserslist = require('browserslist');
module.exports = {
},
plugins: [
// `gatsby-plugin-postcss`,
{
resolve: `gatsby-plugin-postcss`,
options: {
postCssPlugins: [
autoprefixer({ browsers: browserslist() }),
],
},
],
};package.json：
// ...
"browserslist": ["defaults"]我感到很不安：
警告替换自动重定位浏览器选项到浏览器配置。在package.json或.browserslistrc文件中使用浏览器列表键。
使用浏览器选项可能会导致错误。Browserslist配置可用于Babel、自动修复程序、postcss-正常化和其他工具。
如果确实需要使用选项，请将其重命名为overrideBrowserslist。
了解更多信息，请访问：https://github.com/browserslist/browserslist#readme https://twitter.com/browserslist
HTML显示没有设置前缀。
此配置工作正常(在包含浏览器前缀的构建文件中)，但它仍然抱怨我不使用浏览器列表：
{
resolve: `gatsby-plugin-postcss`,
options: {
postCssPlugins: [
autoprefixer({
browsers: ['last 2 versions', 'not ie 10'],
grid: true,
})
],
},
}什么是正确的插件选项配置，以便自动修复程序接受我的浏览器列表？
回答 1
Stack Overflow用户
发布于 2021-03-14 10:24:23
在gastby-config.js文件中
const autoprefixer = require('autoprefixer');
const postcssAspectRatio = require('postcss-aspect-ratio');
{
resolve: `gatsby-plugin-postcss`,
options: {
postCssPlugins: [
autoprefixer(),
postcssAspectRatio
],
},
},我有一个独立的浏览器选项的.browserslistrc文件。检查您的依赖项，但是不需要单独安装browserlist npm。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/61732782
复制相关文章
相似问题
腾讯云开发者
