vue項目中,多行文本樣式顯示省略號,用到了-webkit-box-orient: vertical這個屬性,本地正常,打包線上後,該屬性丟失。webpack打包時把這個樣式過濾掉了。css
網上解決方案有如下:vue
1. 加上這注釋命令webpack
/*! autoprefixer: off */ -webkit-box-orient: vertical; /* autoprefixer: on */
2. optimize-css-assets-webpack-plugin 從
這個插件的問題源頭解決web
註釋掉webpack.prod.conf.js
中下面的代碼ui
new OptimizeCSSPlugin({ cssProcessorOptions: config.build.productionSourceMap ? { safe: true, map: { inline: false } } : { safe: true } }),
這段代碼實現了css的壓縮 註釋後css就沒有壓縮,因此 還要在utils.js中添加, minimize:true spa
const cssLoader = { loader: 'css-loader', options: { sourceMap: options.sourceMap, minimize:true } }
3. 在 webpack.config.js 文件中,找到 new webpack.optimize.UglifyJsPlugin,在裏面添加一條 mangle:false,這個的意思是刪除註釋。這樣打包時就註釋和這行代碼就不會連在一塊兒了插件