首页 > Web开发 > 详细

[ -webkit-box-orient: vertical ] 打包后丢失问题

时间:2018-10-10 15:52:40      阅读:212      评论:0      收藏:0      [点我收藏+]

vue项目中,多行文本样式显示省略号,用到了-webkit-box-orient: vertical这个属性,本地正常,打包线上后,该属性丢失。webpack打包时把这个样式过滤掉了。

网上解决方案有以下:

1. 加上这注释命令

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

2. optimize-css-assets-webpack-plugin 从这个插件的问题源头解决

注释掉webpack.prod.conf.js中下面的代码

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

这段代码实现了css的压缩 注释后css就没有压缩,所以 还要在utils.js中添加,  minimize:true 

const cssLoader = {
   loader: ‘css-loader‘,
   options: {
     sourceMap: options.sourceMap,
     minimize:true
   }
 }

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

 

[ -webkit-box-orient: vertical ] 打包后丢失问题

原文:https://www.cnblogs.com/_error/p/9766845.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!