多行文字时，最后一行文字显示省略号（49/365）

多行文字时，最后一行文字显示省略号

overflow : hidden;

text-overflow: ellipsis;

display: -webkit-box;

-webkit-line-clamp: 2;

-webkit-box-orient: vertical;

在本地测试时可以使用的，然后项目代码打包后，发现不生效。

检查之后发现打包之后有一行样式丢失了即：-webkit-box-orient: vertical;这就是导致不成功的原因。

意识到问题之后，从网上找到了两种解决方案。

方案一：禁止安装的autoprefixer对这行代码进行优化，这样就可以避免打包后这行代码的丢失。

/*! autoprefixer: off */

-webkit-box-orient: vertical;

/* autoprefixer: on */

方案二：修改打包配置文件，去掉css的代码压缩

① webpack.prod.conf.js文件中的以下代码需要注释掉

new OptimizeCSSPlugin({

      cssProcessorOptions: config.build.productionSourceMap

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

        : { safe: true }

    }),

②  utils.js文件中添加minimize:true：

const cssLoader = {

    loader: 'css-loader',

    options: {

      sourceMap: options.sourceMap,

      minimize:true

    }

  }