共计 681 个字符，预计需要花费 2 分钟才能阅读完成。
之前在使用 webstorm 开发 vue 项目过程中，发现代码里的 less 有些地方总是飘红报错，虽然不影响整体代码运行，但是看起来总是很乱很难受，如下图（由于当时忘记截图，在网上找别人的图片，但是遇到问题是一样的）
https://segmentfault.com/img/…
然后我在网上找了很多解决方案，大致有以下几个
1. 加上 rel=”stylesheet/less”
<style lang=”less” rel=”stylesheet/less”>
…
</style>
2. 加上 type=”text/less”
<style scoped lang=”less” type=”text/less”>
…
</style>
3. 先全局安装 npm install less -g；然后 webstorm>tools>file watchers> + >less 配置一下
总结：以上三种方法我都做了尝试，发现并不能解决我的报错问题，继续找其他解决办法
继续搜索发现又有人说是版本问题，于是看了下自己的 webstorm 版本，16 版，好吧 实在是太老了，于是下载最新版，尝试看是否能解决我的问题，
在安装最新版的 webstorm 过程中，又遇到一个坑，装完发现 WebStrom Mac 闪退打不开，原来是之前安装的版本没有完全卸载，如果有遇到同样问题的 请按照以下方法删除残留版本，在命令框输入以下命令
cd library
cd Preferences
输入下面命令，删除所有残留的 webstorm 版本
rm -rf WebStorm2016.3
将所有残留版本删除之后，重新装了最新版的 2018.3.4 的 问题完美解决了 再也不飙红了
