VUE / css -webkit-box-orient: vertical 打包放到线上不显示

最新推荐文章于 2023-12-19 14:32:35 发布

Lear_博客

最新推荐文章于 2023-12-19 14:32:35 发布

阅读量256

点赞数

分类专栏：前端开发 - CSS/CSS3 文章标签： css vue.js webkit

本文链接：https://blog.csdn.net/qq_39292868/article/details/130984277

版权

7 篇文章 0 订阅

订阅专栏

问题：

-webkit-box-orient: vertical 这个属性在本地运行是存在的，但是打包后放到线上这个属性消失了；

问题出现原因：打包时这个属性和注释混在了一起（个人猜测）

解决办法：下面每种都可解决，根据个人需求随意挑选

1.直接在行内加 -webkit-box-orient: vertical（个别元素添加适合）

2.在我们的webpack.config.js文件中，找到 new webpack.optimize.UglifyJsPlugin，在里面添加一条 mangle:false，这个的意思是删除注释。这样打包时就注释和这行代码就不会连在一起了

3.把这句代码前后都加注释，如下

/*! autoprefixer: off */
-webkit-box-orient: vertical;
/* autoprefixer: on */

4.找到webpack.prod.conf.js，并将如下代码注释

new OptimizeCSSPlugin({cssProcessorOptions: config.build.productionSourceMap? { safe: true, map: { inline: false } }: { safe: true }
}),

关注