由于配置了 postcss 的插件 autoprefixer 自動(dòng)添加前綴插件啤呼，在插件配置時(shí)出錯(cuò)，參照官網(wǎng)的配置，并沒(méi)有配置規(guī)則
module.exports = {
'plugins': {
// to edit target browsers: use "browserslist" field in package.json
'autoprefixer': {}
},
}
上面是官網(wǎng)寫的配置优炬，并沒(méi)用寫 需要添加的瀏覽器規(guī)則
于是，經(jīng)過(guò)一番波折潘靖，找到一份 配置規(guī)則
module.exports = {
plugins: [
// 兼容瀏覽器穿剖，添加前綴
require('autoprefixer')({
overrideBrowserslist: [
"Android 4.1",
"iOS 7.1",
"Chrome > 31",
"ff > 31",
"ie >= 8"
//'last 2 versions', // 所有主流瀏覽器最近2個(gè)版本
],
grid: true
})
]
}
寫上去，自動(dòng)添加前綴的小姑生效了卦溢，但是出現(xiàn)了一個(gè)報(bào)錯(cuò)糊余，
雖然報(bào)錯(cuò)并不影響程序運(yùn)行，服務(wù)器依然啟動(dòng)了单寂，
但是贬芥，看著報(bào)錯(cuò)始終覺(jué)得有問(wèn)題，沒(méi)提示才是最好的
image.png
報(bào)錯(cuò)信息如上
解決方式宣决，
image.png
Please do not use display: contents; if you have grid setting enabled
請(qǐng)不要使用顯示:內(nèi)容;如果您啟用了網(wǎng)格設(shè)置
就很明顯了蘸劈，如掉 配置中的 grid: true 即可
module.exports = {
'plugins': {
// to edit target browsers: use "browserslist" field in package.json
'autoprefixer': {
browsers: [
"Android 4.1",
"iOS 7.1",
"Chrome > 31",
"ff > 31",
"ie >= 8"
//'last 2 versions', // 所有主流瀏覽器最近2個(gè)版本
]
}
},
}
或者這樣
module.exports = {
plugins: [
// 兼容瀏覽器，添加前綴
require('autoprefixer')({
overrideBrowserslist: [
"Android 4.1",
"iOS 7.1",
"Chrome > 31",
"ff > 31",
"ie >= 8"
//'last 2 versions', // 所有主流瀏覽器最近2個(gè)版本
]
})
]
}
這樣報(bào)錯(cuò)信息就沒(méi)了
