perf: change >>> ::v-deep

src/components/DragSelect/index.vue

@@ -48,14 +48,18 @@ export default {
 }
 </script>
 
-<style scoped>
+<style lang="scss" scoped>
-.drag-select >>> .sortable-ghost {
+.drag-select {
+  ::v-deep {
+    .sortable-ghost {
       opacity: .8;
       color: #fff !important;
       background: #42b983 !important;
     }
 
-.drag-select >>> .el-tag {
+    .el-tag {
       cursor: pointer;
     }
+  }
+}
 </style>

src/components/JsonEditor/index.vue

@@ -54,19 +54,24 @@ export default {
 }
 </script>
 
-<style scoped>
+<style lang="scss" scoped>
 .json-editor {
   height: 100%;
   position: relative;
-}
+
-.json-editor >>> .CodeMirror {
+  ::v-deep {
+    .CodeMirror {
       height: auto;
       min-height: 300px;
     }
-.json-editor >>> .CodeMirror-scroll{
+
+    .CodeMirror-scroll {
       min-height: 300px;
     }
-.json-editor >>> .cm-s-rubyblue span.cm-string {
+
+    .cm-s-rubyblue span.cm-string {
       color: #F08047;
     }
+  }
+}
 </style>

src/components/Tinymce/index.vue

@@ -220,28 +220,37 @@ export default {
 }
 </script>
 
-<style scoped>
+<style lang="scss" scoped>
 .tinymce-container {
   position: relative;
   line-height: normal;
 }
-.tinymce-container>>>.mce-fullscreen {
+
+.tinymce-container {
+  ::v-deep {
+    .mce-fullscreen {
       z-index: 10000;
     }
+  }
+}
+
 .tinymce-textarea {
   visibility: hidden;
   z-index: -1;
 }
+
 .editor-custom-btn-container {
   position: absolute;
   right: 4px;
   top: 4px;
   /*z-index: 2005;*/
 }
+
 .fullscreen .editor-custom-btn-container {
   z-index: 10000;
   position: fixed;
 }
+
 .editor-upload-btn {
   display: inline-block;
 }