el-table之show-overflow-tooltip 属性不生效及webstorm持续updating indices解

一、问题描述

在使用el-table表格时，有时会用到show-overflow-tooltip属性，即当单元格内容不能完全显示时显示tooltip文字提示，并且单元格里的内容显示省略号。但是在ie浏览器中有时单元格里的内容过长并且显示了省略号，但是鼠标滑上却不显示tooltip。

二、问题分析

这是因为单元格的padding-right影响到的，在css样式中添加以下代码即可：

.el-table .cell, .el-table th div {
	padding-right: 0;
}

三、延伸阅读：webstorm持续updating indices解决方法

在应用Webstorm进行开发相关工作时，发现IDE一直处于updating indices状态，根据错误提示，查看项目目录中.idea\workspace.xml文件，发现在进行git版本管理过程中，此文件进行了merge操作，结果导致文件中内容格式错乱，通过回退版本，发现问题并未解决，通过网络查询，可能是由于项目中node_modules文件过大，且将该文件夹作为目录标记，解决方法就是右键node_modules，选择Mark Directory as->Excluded,会使IDEA排除index这个文件夹，问题得以解决。

四、拓展阅读

• 《Vue进阶（九十三）：show-overflow-tooltip实现表格列内容过长显示提示》

五、拓展阅读

在Vue项目npm run build过程中，突然爆出CssSyntaxError unclosed bracket的错误提示，一脸懵，好好的项目怎么突然就出幺蛾子了呢？

奇怪的是项目执行npm run dev命令时，可正常运行，而pro版本跟dev的版本中差了一个optimize-css-assets-webpack-plugin这个文件的引用，所以在webpack.prod.conf.js中找到该文件引用处：

// optimize-css-assets-webpack-plugin插件的作用是压缩css代码的，还能去掉extract-text-webpack-plugin插件抽离文件产生的重复代码，因为同一个css可能在多个模块中出现所以会导致重复代码，换句话说这两个插件是两兄弟
var OptimizeCSSPlugin = require('optimize-css-assets-webpack-plugin')

首先将上述组件引用注释掉,然后执行npm run build,build成功，随后就很简单了，就是去看一下build好的dist文件里面的app....css，然后继续去搜索"//"，这样子的工作量就少了很多，找到相应的注释代码，然后删掉不合理的注释代码。

最后就是把webpack.prod.conf.js中注释掉的内容恢复，然后重新build一下，问题解决。

六、延伸阅读

• 《Vue进阶（五十一）： vue-cli脚手架build目录中的webpack.base.conf.js配置文件》
• 《Vue进阶（五十二）：vue-cli脚手架build目录中的webpack.dev.conf.js配置文件》
• 《Vue进阶（五十三）：vue-cli脚手架build目录中的webpack.prod.conf.js配置文件》
• 《Vue进阶（五十四）：vue-cli脚手架build目录中的dev-server.js配置文件》
• 《Vue进阶（五十五）：vue-cli脚手架build目录中的build.js配置文件》
• 《Vue进阶（五十六）：vue-cli脚手架build目录中的karma.conf.js配置文件》
• 《Vue进阶（幺零八）：npm run build 错误 (node:7852) UnhandledPromiseRejectionWarning: CssSyntaxError:xxxx. 解决分析》