vue中打包后-webkit-box-orient: vertical消失（超出省略号失效）

一、第一种方法
单行

1.宽度固定
2.overflow:hidden /* 超出部分不显示 */
3.white-space:nowrap/* 不换行 */
4.text-overflow:ellipsis /* 超出部分显示为... */

之前写代码的时候遇到一个问题，就是用了下面这段css代码来让文字超出范围隐藏并显示省略号。(**line-height要加上，要不会超出部分会出现半个字符的情况)

line-height: **px;
overflow:hidden;/*超出隐藏*/
text-overflow:ellipsis;/*文本溢出时显示省略标记*/
display:-webkit-box;/*设置弹性盒模型*/
-webkit-line-clamp:1;/*文本占的行数,如果要设置2行加...则设置为2*/
-webkit-box-orient: vertical;

然鹅本地运行的时候是没有问题的，但是build之后发现失效了。仔细一看是 -webkit-box-orient: vertical; 没有起效。
最后各种修改之后发现应该是webpack的锅
解决方案是改成下面这样

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

记得要带上感叹号
参考：https://www.jianshu.com/p/33284f21753d
二、第二种方法
注释到这段代码

如果我们不想注释掉，也可以设置参数 autoprefixer 参数为 false ：

? { safe: true, map: { inline: false } ,autoprefixer:false } : { safe: true,autoprefixer:false  }

其他：word-break:break-all;//允许在单词内换行
word-wrap:break-word;//允许长单词换到下一行