最近在做vue项目的时候页面处理多行文本样式时用到了-webkit-box-orient: vertical这个属性，本地跑项目没问题，但是打包放到服务器后发现这个属性丢失了。如下图：

后来在网上查了一下，发现可能是optimize-css-assets-webpack-plugin这个插件的问题，导致打包时这个属性和注释混在了一起（个人猜测）,其实解决办法很简单，只需要在这个属性前后加一个特殊注释即可，如下图：

也就是说在使用“-webkit-box-orient: vertical;”需要这样使用

/* ! autoprefixer: off */

-webkit-box-orient: vertical;

/* autoprefixer: on */

　　

vue项目中打包编译后，CSS样式【-webkit-box-orient: vertical】打包后丢失问题的更多相关文章

  1. vue项目中遇到的一些问题

    或访问:https://github.com/littleHiuman/experiences-about-vue  欢迎补充! vuex 状态 vue-cli 命令行 vue vue vue-rou ...

  2. <转载> VUE项目中CSS管理

    vue的scoped 在vue项目中,当 .vue文件中 <style> 标签有 *scoped 属性时,它的 CSS 只作用于当前组件中的元素,很好的实现了样式私有化的目的. 使用sco ...

  3. vue项目中postcss-pxtorem的使用及webpack中的配置 css中单位px和em，rem的区别

    移动手机版要求我们在制作嵌入h5的时候去适配不同的手机.适配有多重模式,有flex.百分比等.字体大小的控制也有px.百分比.rem等单位,webpack中 px转rem. vue项目中postcss ...

  4. VUE项目中使用this.$forceUpdate();解决页面v-for中修改item属性值后页面v-if不改变的问题

    VUE项目中使用this.$forceUpdate();解决页面v-for中修改item属性值后页面v-if不改变的问题:https://blog.csdn.net/jerrica/article/d ...

  5. 转：如何在Vue项目中使用vw实现移动端适配

    https://www.w3cplus.com/mobile/vw-layout-in-vue.html 有关于移动端的适配布局一直以来都是众说纷纭,对应的解决方案也是有很多种.在<使用Flex ...

  6. 在Vue项目中使用vw实现移动端适配

    有关于移动端的适配布局一直以来都是众说纷纭,对应的解决方案也是有很多种.在<使用Flexible实现手淘H5页面的终端适配>提出了Flexible的布局方案,随着viewport单位越来越 ...

  7. 如何在Vue项目中使用vw实现移动端适配(转)

    有关于移动端的适配布局一直以来都是众说纷纭,对应的解决方案也是有很多种.在<使用Flexible实现手淘H5页面的终端适配>提出了Flexible的布局方案,随着viewport单位越来越 ...

  8. 如何在Vue项目中使用vw实现移动端适配

    有关于移动端的适配布局一直以来都是众说纷纭,对应的解决方案也是有很多种.在< 使用Flexible实现手淘H5页面的终端适配>提出了Flexible的布局方案,随着 viewport 单位 ...

  9. 如何在VUE项目中使用SCSS

    首先要了解什么是CSS 预处理器? SCSS是一种CSS预处理语言 定义了一种新的专门的编程语言,编译后形成正常的css文件,为css增加一些编程特性,无需考虑浏览器的兼容性(完全兼容css3),让c ...

  10. 如何在Vue项目中，通过点击DOM自动定位VScode中的代码行？

    作者:vivo 互联网大前端团队- Youchen 一.背景 现在大型的 Vue项目基本上都是多人协作开发,并且随着版本的迭代,Vue 项目中的组件数也会越来越多,如果此时让你负责不熟悉的页面功能开发 ...

随机推荐

  1. HotSpotVM创建过程（JNI_CreateJavaVM）详解

    来自:<Java Performance>第3章 JVM Overview The HotSpot VM's implementation of the JNI_CreateJavaVM ...

  2. hibernate学习笔记（5）在数据库中存取图片

    如何从数据库读取存入的图片,即Blob(二进制)数据. 先从数据库读取对象. 再从获取的对象中得到blob对象. 通过blob对象的getBinaryStream()方法获取input输出流. 之后通 ...

  3. C++之deque

    deque(包含头文件#include<deque>)由若干段连续空间串接而成,一旦有必要在deque的头部或尾端增加新的空间,便配置一段定量连续的空间,串接在deque的头部或尾端.de ...

  4. 第4章_Java仿微信全栈高性能后台+移动客户端

    基于web端使用netty和websocket来做一个简单的聊天的小练习.实时通信有三种方式:Ajax轮询.Long pull.websocket,现在很多的业务场景,比方说聊天室.或者手机端onli ...

  5. 使用Java建立聊天客户端

    ---------------siwuxie095                             关于 聊天服务器,详见本人博客的分类:来一杯Java, 里面的 使用ServerSocket ...

  6. vue 跨域访问http

    axios用法: npm install axios --save-dev 2.导入: import axios from 'axios'; 3.使用($(form)需要先按装jQuery) axio ...

  7. Python 网络爬虫 005 (编程) 如何编写一个可以 下载（或叫：爬取）一个网页 的网络爬虫

    如何编写一个可以 下载(或叫:爬取)一个网页 的网络爬虫 使用的系统:Windows 10 64位 Python 语言版本:Python 2.7.10 V 使用的编程 Python 的集成开发环境:P ...

  8. ROS Learning-012 beginner_Tutorials （编程） 创建自定义的ROS消息和ROS服务

    ROS Indigo beginner_Tutorials-11 创建自定义的ROS消息和ROS服务 我使用的虚拟机软件:VMware Workstation 11 使用的Ubuntu系统:Ubunt ...

  9. BuilderPattern（23种设计模式之一）

    设计模式六大原则(1):单一职责原则 设计模式六大原则(2):里氏替换原则 设计模式六大原则(3):依赖倒置原则 设计模式六大原则(4):接口隔离原则 设计模式六大原则(5):迪米特法则 设计模式六大 ...

  10. 10、R常用命令

    转载:http://www.bio-info-trainee.com/579.html 关于R语言包的一些操作,挺重要的!!! R的包(package)通常有两种:1 binary package:这 ...