vuetify 和 moncao-editor css 冲突

Question

当我使用Vuetify进行开发时，使用

moncao-editor

，会出现样式覆盖：

import 'vuetify/styles'

如果我注释掉 vuetify 样式

//import 'vuetify/styles'

请告诉我如何解决冲突。

我想正确显示阴影斜线。

Answer 1

原因找到了，是vuetify的css重置导致的。 文件路径：node_modules/vuetify/lib/styles/generic/_reset.scss

::after {
      background-repeat: no-repeat; /* Set `background-repeat: no-repeat` to all elements and pseudo elements */
      box-sizing: inherit;
    }

您可以尝试注释掉这段代码来调试。调试完成后，对引入第三方文件的地方进行深入修改。

:deep(.monaco-editor .diagonal-fill) {
  background-repeat: repeat;
}

至此，问题就解决了