-webkit-box-orient: vertical; 複数行テキスト省略記号スタイルの無効化の問題

1095 ワード

げんしょうwebpack圧縮パッケージvueプロジェクトを使用して、省略記号を表示するテキストの複数行のキーcss文-webkit-box-orient: vertical;が不明に失効したという問題に遭遇しました.資料を調べると、スタイル変更の前後に注釈(後処理プログラム)を追加することを提案する人が少なくありません.
/*! autoprefixer: off */
-webkit-box-orient: vertical;
/* autoprefixer: on */

再度梱包して、スタイルが正常に戻ったことを発見しました.コンソールに警告が1つ追加されました.
‘(Emitted value instead of an instance of Error) 
autoprefixer: \css\share.css:199:3: Second Autoprefixer control comment was ignored.
 Autoprefixer applies control comment to whole block, not to next rules.’

の原因となる
警告で述べたように、以上のcss処理文は、その後のcssではなく、cssブロック全体を制御するべきである.
しょり
次のように変更します.
/* autoprefixer: ignore next */
-webkit-box-orient: vertical;

そして梱包すれば正常です
2020-6.22改訂
以上の設定は、依然として有効ではありませんので、以下のソリューションを発見しても構いません.
new OptimizeCSSPlugin({
  cssProcessorOptions: config.build.productionSourceMap
    ? { safe: true, map: { inline: false }, autoprefixer: { remove: false } }
    : { safe: true , autoprefixer: { remove: false }}
})