webstorm中css inspections 如何识别子组件中的样式

Question

业务背景

• 在webstorm中开发vue项目
• 会引用到第3方ui组件,比如mint-ui
• 经常会对mint-ui里面的默认css样式进行修改

.

• css示例代码如下:

<style scoped>
 /deep/ .mint-cell-wrapper {
      padding: 20px;
      ...

遇到的问题

• 这样修改是完全Ok的
• 但是,webstorm默认会检查css规则
• 当发现你定义的一个css类选择器,在当前页面的html中没有出现时
• 就发会出警告

.

• 警告内容如下

我的解决方法

• 忽略不管他,因为是警告,不管也是可以的,但有时候看到这种波浪线,心里就有点别扭
• 也可以直接在样式检查里面关掉这条检查规则,但是这样不太优雅

期望的结果

• 他这个问题产生的原因
• 肯定是因为webstorm无法识别子组件里面的样式
• 要怎么样设置,才能识别到子组件里面的样式呢?