Switch to dart-sass and make deploy script fail-safe

node-sass 4.x cannot build on arm64/Node 16. Use sass with ::v-deep
instead of /deep/, and only replace the server dist after the upload
is unpacked and verified.

Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>

package.json

@@ -47,6 +47,7 @@
     "eslint-plugin-vue": "^5.0.0",
     "node-sass": "^4.9.0",
     "qs": "^6.9.0",
+    "sass": "^1.32.13",
     "sass-loader": "^7.1.0",
     "vue-cropper": "^0.4.9",
     "vue-template-compiler": "^2.6.10"

prod_build.sh

@@ -1,6 +1,10 @@
 # sh 执行打包到正式服上
+set -e
 npm run build
+test -f dist/index.html
+rm -f dist.zip
 zip -q -r dist.zip dist
 scp dist.zip root@172.104.39.32:/tmp/dist.zip
-ssh root@172.104.39.32 "cd /server/91fans/webadmin/dist/ && rm -rf ./* && unzip -q /tmp/dist.zip -d /tmp/extract && mv /tmp/extract/dist/* . && rm -rf /tmp/extract /tmp/dist.zip && echo DEPLOY_OK"
+# 先解压并校验，成功后再替换线上目录，避免失败时清空线上
+ssh root@172.104.39.32 "set -e; rm -rf /tmp/extract && unzip -q /tmp/dist.zip -d /tmp/extract && test -f /tmp/extract/dist/index.html && cd /server/91fans/webadmin/dist/ && rm -rf ./* && mv /tmp/extract/dist/* . && rm -rf /tmp/extract /tmp/dist.zip && echo DEPLOY_OK"
 rm dist.zip

src/components/ConfigTable/index.vue

@@ -324,7 +324,7 @@ export default {
     flex: 1;
     overflow: auto;
 
-    /deep/ .el-button--mini {
+    ::v-deep .el-button--mini {
       padding: 7px 11px !important;
       font-weight: normal !important;
       &.isNullText {
@@ -355,7 +355,7 @@ export default {
     border-radius: 0 0 5px 5px;
     background: #ebe5e1;
 
-    /deep/ .el-pagination {
+    ::v-deep .el-pagination {
       padding-bottom: 30px;
     }
   }

src/components/baseUpload.vue

@@ -237,7 +237,7 @@ export default {
     height: 100%;
   }
 
-  /deep/ .el-upload {
+  ::v-deep .el-upload {
     width: 100%;
     height: 100%;
     border: 1px dashed #d9d9d9;

src/components/globalUploader.vue

@@ -363,7 +363,7 @@ export default {
     transform: translate(-50%, -50%);
     font-size: 16px;
   }
-  // /deep/.uploader-file-icon {
+  // ::v-deep.uploader-file-icon {
   //     &:before {
   //         content: '' !important;
   //     }
@@ -377,7 +377,7 @@ export default {
   //         background: url(./images/text-icon.png);
   //     }
   // }
-  /deep/.uploader-file-actions > span {
+  ::v-deep.uploader-file-actions > span {
     margin-right: 6px;
   }
 }

src/components/rich-editor/index.vue

@@ -410,7 +410,7 @@ export default {
 
 <style lang="scss" scoped>
 .wangEditor {
-  /deep/ img {
+  ::v-deep img {
     width: 100%;
     min-height: 200px;
   }

src/components/rich-preview/content.vue

@@ -141,7 +141,7 @@ export default {
     font-weight: 400;
     white-space: pre-line;
 
-    /deep/ img {
+    ::v-deep img {
       width: 100%;
       min-height: 200px;
       object-fit: scale-down;

src/components/rich-preview/index.vue

@@ -61,7 +61,7 @@ export default {
 .look-dialog {
   z-index: 999999 !important;
 
-  /deep/ .el-dialog__header {
+  ::v-deep .el-dialog__header {
     position: sticky;
     top: 0;
     background: white;
@@ -81,7 +81,7 @@ export default {
     position: relative;
     padding: 10px 20px;
 
-    /deep/ img {
+    ::v-deep img {
       width: 100%;
     }
   }

src/components/selectReasonAction.vue

@@ -284,7 +284,7 @@ export default {
     display: flex;
     align-items: center;
   }
-  /deep/.el-table__body tr.current-row > td {
+  ::v-deep.el-table__body tr.current-row > td {
     background-color: #1890ff;
     color: #fff;
   }

src/views/activityManagement/newActivityList/index.vue

@@ -524,23 +524,23 @@ export default {
   -webkit-transform: translate(-50%);
   transform: translate(-50%);
 }
-/deep/ .el-form-item__content {
+::v-deep .el-form-item__content {
   display: flex;
   width: 100%;
 }
-/deep/ .el-date-editor {
+::v-deep .el-date-editor {
   width: 100% !important;
 }
-/deep/ .el-select {
+::v-deep .el-select {
   width: 100%;
 }
-/deep/ .el-form-item {
+::v-deep .el-form-item {
   display: flex;
   align-items: center;
 }
 .wangEditor {
   position: initial !important;
-  /deep/ .w-e-text-container {
+  ::v-deep .w-e-text-container {
     height: 500px !important;
   }
 }

src/views/actressManagement/actressList/index.vue

@@ -374,13 +374,13 @@ export default {
   -webkit-transform: translate(-50%);
   transform: translate(-50%);
 }
-/deep/ .el-form-item__content {
+::v-deep .el-form-item__content {
   display: flex;
 }
-/deep/ .el-select {
+::v-deep .el-select {
   width: 100%;
 }
-/deep/ .el-form-item {
+::v-deep .el-form-item {
   display: flex;
   align-items: center;
 }

src/views/agentDistrictProvider/adReview/index.vue

@@ -253,8 +253,8 @@ export default {
       color: #eb5f84;
     }
   }
-  /deep/.col_layout {
-    /deep/ div {
+  ::v-deep.col_layout {
+    ::v-deep div {
       display: flex;
       justify-content: center;
       padding-left: 50px;

src/views/aiManagement/AIDrawList/components/EditStatus.vue

@@ -83,7 +83,7 @@ export default {
 
 <style lang="scss" scoped>
 .dialog-edit-flow {
-  /deep/ .el-date-editor.el-input {
+  ::v-deep .el-date-editor.el-input {
     width: 200px;
   }
 }

src/views/aiManagement/AIDrawList/index.vue

@@ -194,11 +194,11 @@ export default {
 
 <style lang="scss" scoped>
 .ai-order-list {
-  /deep/ .el-button {
+  ::v-deep .el-button {
     padding: 9px 15px;
   }
 
-  /deep/ .el-image {
+  ::v-deep .el-image {
     width: 100px;
     height: 100px;
 

src/views/aiManagement/AiTemplate/editOrAdd.vue

@@ -157,7 +157,7 @@ export default {
 </script>
 
 <style lang="scss" scoped>
-/deep/ .el-form-item__error {
+::v-deep .el-form-item__error {
   left: 100px;
 }
 </style>

src/views/aiManagement/aiChangeFaceImgList/index.vue

@@ -463,19 +463,19 @@ export default {
   display: flex;
 }
 .clickNumDialog {
-  /deep/ .el-dialog__body {
+  ::v-deep .el-dialog__body {
     padding-top: 10px;
   }
-  /deep/ .el-pagination {
+  ::v-deep .el-pagination {
     float: none;
     text-align: right;
     margin-top: 30px;
   }
 }
-/deep/ .el-input {
+::v-deep .el-input {
   width: 80%;
 }
-/deep/ .el-form-item {
+::v-deep .el-form-item {
   width: 100%;
 }
 </style>

src/views/aiManagement/aiChangeFaceList/index.vue

@@ -709,10 +709,10 @@ export default {
   -webkit-transform: translate(-50%);
   transform: translate(-50%);
 }
-/deep/ .el-form-item__content {
+::v-deep .el-form-item__content {
   display: flex;
 }
-/deep/ .el-select {
+::v-deep .el-select {
   width: 100%;
 }
 .form-flex-box {

src/views/aiManagement/aiChangeFaceStencil/index.vue

@@ -951,10 +951,10 @@ export default {
   -webkit-transform: translate(-50%);
   transform: translate(-50%);
 }
-/deep/ .el-form-item__content {
+::v-deep .el-form-item__content {
   display: flex;
 }
-/deep/ .el-select {
+::v-deep .el-select {
   width: 100%;
 }
 .form-flex-box {

src/views/aiManagement/aiImageToVideoList/components/EditStatus.vue

@@ -83,7 +83,7 @@ export default {
 
 <style lang="scss" scoped>
 .dialog-edit-flow {
-  /deep/ .el-date-editor.el-input {
+  ::v-deep .el-date-editor.el-input {
     width: 200px;
   }
 }

src/views/aiManagement/aiImageToVideoList/index.vue

@@ -203,11 +203,11 @@ export default {
 
 <style lang="scss" scoped>
 .ai-order-list {
-  /deep/ .el-button {
+  ::v-deep .el-button {
     padding: 9px 15px;
   }
 
-  /deep/ .el-image {
+  ::v-deep .el-image {
     width: 100px;
     height: 100px;
 

src/views/aiManagement/aiNovelList/index.vue

@@ -200,11 +200,11 @@ export default {
 
 <style lang="scss" scoped>
 .ai-novel-list {
-  /deep/ .el-button {
+  ::v-deep .el-button {
     padding: 9px 15px;
   }
 
-  /deep/ .el-image {
+  ::v-deep .el-image {
     width: 100px;
     height: 100px;
 

src/views/aiManagement/aiTradeList/index.vue

@@ -664,19 +664,19 @@ export default {
   display: flex;
 }
 .clickNumDialog {
-  /deep/ .el-dialog__body {
+  ::v-deep .el-dialog__body {
     padding-top: 10px;
   }
-  /deep/ .el-pagination {
+  ::v-deep .el-pagination {
     float: none;
     text-align: right;
     margin-top: 30px;
   }
 }
-/deep/ .el-input {
+::v-deep .el-input {
   width: 80%;
 }
-/deep/ .el-form-item {
+::v-deep .el-form-item {
   width: 100%;
 }
 </style>

src/views/aiManagement/components/UpdateAiPlaza.vue

@@ -184,16 +184,16 @@ export default {
 
 <style lang="scss" scoped>
 .updateGroupChat {
-  /deep/ .el-date-editor.el-input {
+  ::v-deep .el-date-editor.el-input {
     width: 200px;
   }
-  /deep/ .el-input-number__decrease {
+  ::v-deep .el-input-number__decrease {
     display: none;
   }
-  /deep/ .el-input-number__increase {
+  ::v-deep .el-input-number__increase {
     display: none;
   }
-  /deep/ .el-input__inner {
+  ::v-deep .el-input__inner {
     padding-left: 10px;
     padding-right: 10px;
     text-align: left;

src/views/animationManage/acgVidResCfg/components/previewPicture.vue

@@ -138,14 +138,14 @@ export default {
       }
     }
   }
-  /deep/ .el-upload-list--picture-card .el-upload-list__item {
+  ::v-deep .el-upload-list--picture-card .el-upload-list__item {
     width: 150px;
     height: 150px;
     .el-upload-list__item-delete {
       display: none;
     }
   }
-  /deep/ .el-upload--picture-card {
+  ::v-deep .el-upload--picture-card {
     width: 150px;
     height: 150px;
     line-height: 170px;

src/views/animationManage/acgVidResCfg/components/subsetMediaList.vue

@@ -809,7 +809,7 @@ export default {
 </script>
 <style scoped lang="scss">
 .textPreviewDialog {
-  /deep/ .el-dialog__body {
+  ::v-deep .el-dialog__body {
     max-height: 600px;
     overflow-y: auto;
   }
@@ -819,7 +819,7 @@ export default {
   }
 }
 .comicsPreviewDialog {
-  /deep/ .el-dialog__body {
+  ::v-deep .el-dialog__body {
     max-height: 700px;
     overflow-y: auto;
   }

src/views/animationManage/acgVidResCfg/index.vue

@@ -743,7 +743,7 @@ export default {
   .tagItem {
     margin: 0 5px 5px;
   }
-  /deep/ .el-form-item__content {
+  ::v-deep .el-form-item__content {
     display: flex;
   }
   .param-input {

src/views/animationManage/animeContentList/index.vue

@@ -723,21 +723,21 @@ export default {
   -webkit-transform: translate(-50%);
   transform: translate(-50%);
 }
-/deep/ .el-form-item__content {
+::v-deep .el-form-item__content {
   display: flex;
 }
-/deep/ .el-select {
+::v-deep .el-select {
   width: 100%;
 }
-/deep/ .el-date-editor.el-input,
+::v-deep .el-date-editor.el-input,
 .el-date-editor.el-input__inner {
   width: 100%;
 }
-/deep/ .el-upload-list--picture-card .el-upload-list__item {
+::v-deep .el-upload-list--picture-card .el-upload-list__item {
   width: 120px;
   height: 120px;
 }
-/deep/ .el-upload--picture-card {
+::v-deep .el-upload--picture-card {
   width: 120px;
   height: 120px;
   line-height: 130px;

src/views/animationManage/animeList/components/preview-media.vue

@@ -1435,7 +1435,7 @@ export default {
 }
 
 .textPreviewDialog {
-  /deep/ .el-dialog__body {
+  ::v-deep .el-dialog__body {
     max-height: 600px;
     overflow-y: auto;
   }
@@ -1445,7 +1445,7 @@ export default {
   }
 }
 .comicsPreviewDialog {
-  /deep/ .el-dialog__body {
+  ::v-deep .el-dialog__body {
     max-height: 700px;
     overflow-y: auto;
   }

src/views/animationManage/animeList/index.vue

@@ -2257,21 +2257,21 @@ export default {
   font-size: 11px;
   line-height: 16px;
 }
-/deep/ .el-form-item__content {
+::v-deep .el-form-item__content {
   display: flex;
 }
-/deep/ .el-select {
+::v-deep .el-select {
   width: 100%;
 }
-/deep/ .el-date-editor.el-input,
+::v-deep .el-date-editor.el-input,
 .el-date-editor.el-input__inner {
   width: 100%;
 }
-/deep/ .el-upload-list--picture-card .el-upload-list__item {
+::v-deep .el-upload-list--picture-card .el-upload-list__item {
   width: 120px;
   height: 120px;
 }
-/deep/ .el-upload--picture-card {
+::v-deep .el-upload--picture-card {
   width: 120px;
   height: 120px;
   line-height: 130px;

src/views/animationManage/animeTagsList/index.vue

@@ -742,21 +742,21 @@ export default {
   -webkit-transform: translate(-50%);
   transform: translate(-50%);
 }
-/deep/ .el-form-item__content {
+::v-deep .el-form-item__content {
   display: flex;
 }
-/deep/ .el-select {
+::v-deep .el-select {
   width: 100%;
 }
-/deep/ .el-date-editor.el-input,
+::v-deep .el-date-editor.el-input,
 .el-date-editor.el-input__inner {
   width: 100%;
 }
-/deep/ .el-upload-list--picture-card .el-upload-list__item {
+::v-deep .el-upload-list--picture-card .el-upload-list__item {
   width: 120px;
   height: 120px;
 }
-/deep/ .el-upload--picture-card {
+::v-deep .el-upload--picture-card {
   width: 120px;
   height: 120px;
   line-height: 130px;

src/views/animationManage/bulkUpload/addMedia.vue

@@ -735,7 +735,7 @@ export default {
 
 <style lang="scss" scoped>
 .add-video-warp-box {
-  /deep/ .el-form-item__content {
+  ::v-deep .el-form-item__content {
     display: flex;
   }
   .flex-item {

src/views/animationManage/latitudeList/index.vue

@@ -464,21 +464,21 @@ export default {
   -webkit-transform: translate(-50%);
   transform: translate(-50%);
 }
-/deep/ .el-form-item__content {
+::v-deep .el-form-item__content {
   display: flex;
 }
-/deep/ .el-select {
+::v-deep .el-select {
   width: 100%;
 }
-/deep/ .el-date-editor.el-input,
+::v-deep .el-date-editor.el-input,
 .el-date-editor.el-input__inner {
   width: 100%;
 }
-/deep/ .el-upload-list--picture-card .el-upload-list__item {
+::v-deep .el-upload-list--picture-card .el-upload-list__item {
   width: 120px;
   height: 120px;
 }
-/deep/ .el-upload--picture-card {
+::v-deep .el-upload--picture-card {
   width: 120px;
   height: 120px;
   line-height: 130px;

src/views/animationManage/recommendList/index.vue

@@ -1027,21 +1027,21 @@ export default {
   -webkit-transform: translate(-50%);
   transform: translate(-50%);
 }
-/deep/ .el-form-item__content {
+::v-deep .el-form-item__content {
   display: flex;
 }
-/deep/ .el-select {
+::v-deep .el-select {
   width: 100%;
 }
-/deep/ .el-date-editor.el-input,
+::v-deep .el-date-editor.el-input,
 .el-date-editor.el-input__inner {
   width: 100%;
 }
-/deep/ .el-upload-list--picture-card .el-upload-list__item {
+::v-deep .el-upload-list--picture-card .el-upload-list__item {
   width: 120px;
   height: 120px;
 }
-/deep/ .el-upload--picture-card {
+::v-deep .el-upload--picture-card {
   width: 120px;
   height: 120px;
   line-height: 130px;
@@ -1054,7 +1054,7 @@ export default {
   display: inline-block;
   margin-right: 5px;
 }
-/deep/ .imgDialog .el-dialog {
+::v-deep .imgDialog .el-dialog {
   background: transparent;
   border: 1px solid white;
 }

src/views/animationManage/subsetBatchUpdList/addMedia.vue

@@ -379,7 +379,7 @@ export default {
 
 <style lang="scss" scoped>
 .add-video-warp-box {
-  /deep/ .el-select--small {
+  ::v-deep .el-select--small {
     width: 250px !important;
   }
   .bottomBtn {

src/views/animationManage/taskList/index.vue

@@ -683,21 +683,21 @@ export default {
   -webkit-transform: translate(-50%);
   transform: translate(-50%);
 }
-/deep/ .el-form-item__content {
+::v-deep .el-form-item__content {
   display: flex;
 }
-/deep/ .el-select {
+::v-deep .el-select {
   width: 100%;
 }
-/deep/ .el-date-editor.el-input,
+::v-deep .el-date-editor.el-input,
 .el-date-editor.el-input__inner {
   width: 100%;
 }
-/deep/ .el-upload-list--picture-card .el-upload-list__item {
+::v-deep .el-upload-list--picture-card .el-upload-list__item {
   width: 120px;
   height: 120px;
 }
-/deep/ .el-upload--picture-card {
+::v-deep .el-upload--picture-card {
   width: 120px;
   height: 120px;
   line-height: 130px;

src/views/discountAreaManagement/discountAreaList/index.vue

@@ -534,10 +534,10 @@ export default {
   -webkit-transform: translate(-50%);
   transform: translate(-50%);
 }
-/deep/ .el-form-item__content {
+::v-deep .el-form-item__content {
   display: flex;
 }
-/deep/ .el-select {
+::v-deep .el-select {
   width: 100%;
 }
 .form-flex-box {

src/views/discountAreaManagement/discountAreaVideoList/index.vue

@@ -559,10 +559,10 @@ export default {
   -webkit-transform: translate(-50%);
   transform: translate(-50%);
 }
-/deep/ .el-form-item__content {
+::v-deep .el-form-item__content {
   display: flex;
 }
-/deep/ .el-select {
+::v-deep .el-select {
   width: 100%;
 }
 .form-flex-box {

src/views/groupChatManagement/components/UpdateGroupChat.vue

@@ -126,7 +126,7 @@ export default {
 
 <style lang="scss" scoped>
 .updateGroupChat {
-  /deep/ .el-date-editor.el-input {
+  ::v-deep .el-date-editor.el-input {
     width: 200px;
   }
 }

src/views/groupChatManagement/components/UpdateImgroupmember.vue

@@ -155,16 +155,16 @@ export default {
 
 <style lang="scss" scoped>
 .updateGroupChat {
-  /deep/ .el-date-editor.el-input {
+  ::v-deep .el-date-editor.el-input {
     width: 200px;
   }
-  /deep/ .el-input-number__decrease {
+  ::v-deep .el-input-number__decrease {
     display: none;
   }
-  /deep/ .el-input-number__increase {
+  ::v-deep .el-input-number__increase {
     display: none;
   }
-  /deep/ .el-input__inner {
+  ::v-deep .el-input__inner {
     padding-left: 10px;
     padding-right: 10px;
     text-align: left;

src/views/groupChatManagement/components/UpdateImmessage.vue

@@ -153,16 +153,16 @@ export default {
 
 <style lang="scss" scoped>
 .updateGroupChat {
-  /deep/ .el-date-editor.el-input {
+  ::v-deep .el-date-editor.el-input {
     width: 200px;
   }
-  /deep/ .el-input-number__decrease {
+  ::v-deep .el-input-number__decrease {
     display: none;
   }
-  /deep/ .el-input-number__increase {
+  ::v-deep .el-input-number__increase {
     display: none;
   }
-  /deep/ .el-input__inner {
+  ::v-deep .el-input__inner {
     padding-left: 10px;
     padding-right: 10px;
     text-align: left;

src/views/lsjMediaLibrary/comicsList/index.vue

@@ -343,7 +343,7 @@ export default {
   flex-direction: column;
   height: 100%;
 
-  /deep/ {
+  ::v-deep {
     .el-form-item--mini.el-form-item {
       margin-bottom: 12px;
     }

src/views/lsjMediaLibrary/novelList/index.vue

@@ -339,7 +339,7 @@ export default {
   flex-direction: column;
   height: 100%;
 
-  /deep/ {
+  ::v-deep {
     .el-form-item--mini.el-form-item {
       margin-bottom: 12px;
     }

src/views/lsjMediaLibrary/postList/index.vue

@@ -357,7 +357,7 @@ export default {
   flex-direction: column;
   height: 100%;
 
-  /deep/ {
+  ::v-deep {
     .el-form-item--mini.el-form-item {
       margin-bottom: 12px;
     }

src/views/lsjMediaLibrary/videoList/index.vue

@@ -374,7 +374,7 @@ export default {
   flex-direction: column;
   height: 100%;
 
-  /deep/ {
+  ::v-deep {
     .el-form-item--mini.el-form-item {
       margin-bottom: 12px;
     }

src/views/mediaLibrary/videoList/index.vue

@@ -751,7 +751,7 @@ export default {
   }
 }
 
-/deep/ {
+::v-deep {
   .el-form-item--mini.el-form-item {
     margin-bottom: 10px;
   }

src/views/moduleConfManagement/happinessPlazaTopList/index.vue

@@ -461,7 +461,7 @@ export default {
   margin-right: 5px;
 }
 
-/deep/ .el-form-item__content {
+::v-deep .el-form-item__content {
   display: flex;
 }
 </style>

src/views/moduleConfManagement/kingKongDistrict/index.vue

@@ -557,10 +557,10 @@ export default {
   -webkit-transform: translate(-50%);
   transform: translate(-50%);
 }
-/deep/ .el-form-item__content {
+::v-deep .el-form-item__content {
   display: flex;
 }
-/deep/ .el-select {
+::v-deep .el-select {
   width: 100%;
 }
 </style>

src/views/moduleConfManagement/moduleList/index.vue

@@ -1237,7 +1237,7 @@ export default {
   -webkit-transform: translate(-50%);
   transform: translate(-50%);
 }
-/deep/ .el-form-item__content {
+::v-deep .el-form-item__content {
   display: flex;
 }
 </style>

src/views/moduleConfManagement/sectionList/index.vue

@@ -844,10 +844,10 @@ export default {
   transform: translate(-50%);
 }
 .clickNumDialog {
-  /deep/ .el-dialog__body {
+  ::v-deep .el-dialog__body {
     padding-top: 10px;
   }
-  /deep/ .el-pagination {
+  ::v-deep .el-pagination {
     float: none;
     text-align: right;
     margin-top: 30px;

src/views/nakedChatManage/nakedChatList/index.vue

@@ -822,7 +822,7 @@ export default {
 
 <style lang="scss" scoped>
 .cover-box {
-  /deep/ .avatar-uploader {
+  ::v-deep .avatar-uploader {
     width: 100.8px;
     height: 158.4px;
   }

src/views/officialWebsite/newsList/index.vue

@@ -437,10 +437,10 @@ export default {
 .news-editor {
   position: relative;
   z-index: 1;
-  /deep/ .w-e-text-container {
+  ::v-deep .w-e-text-container {
     height: 320px !important;
   }
-  /deep/ img {
+  ::v-deep img {
     max-width: 100%;
   }
 }

src/views/productManagement/bannerActivityList/index.vue

@@ -625,21 +625,21 @@ export default {
   -webkit-transform: translate(-50%);
   transform: translate(-50%);
 }
-/deep/ .el-form-item__content {
+::v-deep .el-form-item__content {
   display: flex;
 }
-/deep/ .el-select {
+::v-deep .el-select {
   width: 100%;
 }
-/deep/ .el-date-editor.el-input,
+::v-deep .el-date-editor.el-input,
 .el-date-editor.el-input__inner {
   width: 100%;
 }
-/deep/ .el-upload-list--picture-card .el-upload-list__item {
+::v-deep .el-upload-list--picture-card .el-upload-list__item {
   width: 120px;
   height: 120px;
 }
-/deep/ .el-upload--picture-card {
+::v-deep .el-upload--picture-card {
   width: 120px;
   height: 120px;
   line-height: 130px;

src/views/productManagement/integralConfigure/index.vue

@@ -507,10 +507,10 @@ export default {
   -webkit-transform: translate(-50%);
   transform: translate(-50%);
 }
-/deep/ .el-form-item__content {
+::v-deep .el-form-item__content {
   display: flex;
 }
-/deep/ .el-select {
+::v-deep .el-select {
   width: 100%;
 }
 .form-flex-box {

src/views/productManagement/preSaleConfigure/index.vue

@@ -642,21 +642,21 @@ export default {
   -webkit-transform: translate(-50%);
   transform: translate(-50%);
 }
-/deep/ .el-form-item__content {
+::v-deep .el-form-item__content {
   display: flex;
 }
-/deep/ .el-select {
+::v-deep .el-select {
   width: 100%;
 }
-/deep/ .el-date-editor.el-input,
+::v-deep .el-date-editor.el-input,
 .el-date-editor.el-input__inner {
   width: 100%;
 }
-/deep/ .el-upload-list--picture-card .el-upload-list__item {
+::v-deep .el-upload-list--picture-card .el-upload-list__item {
   width: 120px;
   height: 120px;
 }
-/deep/ .el-upload--picture-card {
+::v-deep .el-upload--picture-card {
   width: 120px;
   height: 120px;
   line-height: 130px;

src/views/shortVideoRecommend/commentBannerList/index.vue

@@ -462,18 +462,18 @@ export default {
 
 <style scoped lang="scss">
 .comment-banner-form {
-  /deep/ .el-form-item {
+  ::v-deep .el-form-item {
     display: flex;
     align-items: center;
   }
 
-  /deep/ .el-form-item__label {
+  ::v-deep .el-form-item__label {
     float: none;
     line-height: 32px;
     padding-bottom: 0;
   }
 
-  /deep/ .el-form-item__content {
+  ::v-deep .el-form-item__content {
     flex: 1;
     margin-left: 0 !important;
     line-height: 32px;
@@ -483,12 +483,12 @@ export default {
 .upload-item {
   align-items: flex-start;
 
-  /deep/ .el-form-item__content {
+  ::v-deep .el-form-item__content {
     display: flex;
     align-items: center;
   }
 
-  /deep/ .el-form-item__label {
+  ::v-deep .el-form-item__label {
     line-height: 61px;
   }
 }
@@ -499,8 +499,8 @@ export default {
   font-size: 12px;
 }
 
-/deep/ .el-date-editor.el-input,
-/deep/ .el-date-editor.el-input__inner {
+::v-deep .el-date-editor.el-input,
+::v-deep .el-date-editor.el-input__inner {
   width: 100%;
 }
 </style>

src/views/shortVideoRecommend/paymentGuideList/index.vue

@@ -839,18 +839,18 @@ export default {
 }
 
 .payment-guide-form {
-  /deep/ .el-form-item {
+  ::v-deep .el-form-item {
     display: flex;
     align-items: center;
   }
 
-  /deep/ .el-form-item__label {
+  ::v-deep .el-form-item__label {
     float: none;
     line-height: 32px;
     padding-bottom: 0;
   }
 
-  /deep/ .el-form-item__content {
+  ::v-deep .el-form-item__content {
     flex: 1;
     margin-left: 0 !important;
     line-height: 32px;
@@ -867,18 +867,18 @@ export default {
 .upload-item {
   align-items: flex-start;
 
-  /deep/ .el-form-item__content {
+  ::v-deep .el-form-item__content {
     display: flex;
     align-items: center;
   }
 
-  /deep/ .el-form-item__label {
+  ::v-deep .el-form-item__label {
     line-height: 122px;
   }
 }
 
-/deep/ .el-date-editor.el-input,
-/deep/ .el-date-editor.el-input__inner {
+::v-deep .el-date-editor.el-input,
+::v-deep .el-date-editor.el-input__inner {
   width: 100%;
 }
 </style>

src/views/statistics/advAnalysis/index.vue

@@ -192,7 +192,7 @@ export default {
   padding-bottom: 20px;
 }
 
-/deep/ .el-table {
+::v-deep .el-table {
   font-size: 12px !important;
 }
 </style>

src/views/systemManagement/systemConfig/index.vue

@@ -1032,21 +1032,21 @@ export default {
 };
 </script>
 <style scoped lang="scss">
-/deep/ .el-form-item__content {
+::v-deep .el-form-item__content {
   display: flex;
   align-items: center;
 }
-/deep/ .el-select {
+::v-deep .el-select {
   width: 100%;
 }
-/deep/ .el-input {
+::v-deep .el-input {
   margin-bottom: 10px;
 }
-/deep/ .el-date-editor.el-input,
+::v-deep .el-date-editor.el-input,
 .el-date-editor.el-input__inner {
   width: 100%;
 }
-/deep/ .el-textarea {
+::v-deep .el-textarea {
   width: 80%;
 }
 .elSwitch {
@@ -1084,7 +1084,7 @@ export default {
             display: flex;
             align-items: center;
             justify-content: center;
-            /deep/ .el-input {
+            ::v-deep .el-input {
               margin-bottom: 0;
             }
             .itemBoxs-select-btn {

src/views/transactionManagement/advanceOrderList/index.vue

@@ -342,10 +342,10 @@ export default {
   -webkit-transform: translate(-50%);
   transform: translate(-50%);
 }
-/deep/ .el-form-item__content {
+::v-deep .el-form-item__content {
   display: flex;
 }
-/deep/ .el-select {
+::v-deep .el-select {
   width: 100%;
 }
 .form-flex-box {

src/views/transactionManagement/integralExchange/index.vue

@@ -417,10 +417,10 @@ export default {
   -webkit-transform: translate(-50%);
   transform: translate(-50%);
 }
-/deep/ .el-form-item__content {
+::v-deep .el-form-item__content {
   display: flex;
 }
-/deep/ .el-select {
+::v-deep .el-select {
   width: 100%;
 }
 .form-flex-box {

src/views/user/backpackList/index.vue

@@ -284,10 +284,10 @@ export default {
   -webkit-transform: translate(-50%);
   transform: translate(-50%);
 }
-/deep/ .el-form-item__content {
+::v-deep .el-form-item__content {
   display: flex;
 }
-/deep/ .el-select {
+::v-deep .el-select {
   width: 100%;
 }
 .form-flex-box {

src/views/user/userFollow/index.vue

@@ -444,8 +444,8 @@ export default {
       color: #eb5f84;
     }
   }
-  /deep/.col_layout {
-    /deep/ div {
+  ::v-deep.col_layout {
+    ::v-deep div {
       display: flex;
       justify-content: center;
       padding-left: 50px;

src/views/user/userList/components/gameCodeDialog.vue

@@ -149,10 +149,10 @@ export default {
   -webkit-transform: translate(-50%);
   transform: translate(-50%);
 }
-/deep/ .el-form-item__content {
+::v-deep .el-form-item__content {
   display: flex;
 }
-/deep/ .el-select {
+::v-deep .el-select {
   width: 100%;
 }
 .form-flex-box {

src/views/user/userList/index.vue

@@ -1627,8 +1627,8 @@ export default {
       color: #eb5f84;
     }
   }
-  /deep/.col_layout {
-    /deep/ div {
+  ::v-deep.col_layout {
+    ::v-deep div {
       display: flex;
       justify-content: center;
       padding-left: 50px;

src/views/user/userMessageList/index.vue

@@ -354,10 +354,10 @@ export default {
   -webkit-transform: translate(-50%);
   transform: translate(-50%);
 }
-/deep/ .el-form-item__content {
+::v-deep .el-form-item__content {
   display: flex;
 }
-/deep/ .el-select {
+::v-deep .el-select {
   width: 100%;
 }
 .form-flex-box {

src/views/user/userPostsLog/index.vue

@@ -341,8 +341,8 @@ export default {
       color: #eb5f84;
     }
   }
-  /deep/.col_layout {
-    /deep/ div {
+  ::v-deep.col_layout {
+    ::v-deep div {
       display: flex;
       justify-content: center;
       padding-left: 50px;

src/views/videoManagement/activeConfig/index.vue

@@ -226,11 +226,11 @@
 
 <style lang="scss" scoped>
     .activeConfig {
-        /deep/ .el-form-item {
+        ::v-deep .el-form-item {
             display: flex;
         }
 
-        /deep/ .el-form-item__content {
+        ::v-deep .el-form-item__content {
             width: 100%;
         }
     }

src/views/videoManagement/emojiList/index.vue

@@ -746,10 +746,10 @@ export default {
   -webkit-transform: translate(-50%);
   transform: translate(-50%);
 }
-/deep/ .el-form-item__content {
+::v-deep .el-form-item__content {
   display: flex;
 }
-/deep/ .el-select {
+::v-deep .el-select {
   width: 100%;
 }
 .avatar-uploader .el-upload {

src/views/videoManagement/goldCoinVideoConfig/components/previewPicture.vue

@@ -138,14 +138,14 @@ export default {
       }
     }
   }
-  /deep/ .el-upload-list--picture-card .el-upload-list__item {
+  ::v-deep .el-upload-list--picture-card .el-upload-list__item {
     width: 150px;
     height: 150px;
     .el-upload-list__item-delete {
       display: none;
     }
   }
-  /deep/ .el-upload--picture-card {
+  ::v-deep .el-upload--picture-card {
     width: 150px;
     height: 150px;
     line-height: 170px;

src/views/videoManagement/goldCoinVideoConfig/index.vue

@@ -684,10 +684,10 @@ export default {
   -webkit-transform: translate(-50%);
   transform: translate(-50%);
 }
-/deep/ .el-form-item__content {
+::v-deep .el-form-item__content {
   display: flex;
 }
-/deep/ .el-select {
+::v-deep .el-select {
   width: 100%;
 }
 .form-flex-box {

src/views/videoManagement/vidResCfg/components/previewPicture.vue

@@ -145,14 +145,14 @@ export default {
       }
     }
   }
-  /deep/ .el-upload-list--picture-card .el-upload-list__item {
+  ::v-deep .el-upload-list--picture-card .el-upload-list__item {
     width: 150px;
     height: 150px;
     .el-upload-list__item-delete {
       display: none;
     }
   }
-  /deep/ .el-upload--picture-card {
+  ::v-deep .el-upload--picture-card {
     width: 150px;
     height: 150px;
     line-height: 170px;

src/views/videoManagement/vidResCfg/index.vue

@@ -756,7 +756,7 @@ export default {
   .tagItem {
     margin: 0 5px 5px;
   }
-  /deep/ .el-form-item__content {
+  ::v-deep .el-form-item__content {
     display: flex;
   }
   .param-input {

src/views/videoManagement/videoExamine/components/batchAutoPublishing.vue

@@ -192,12 +192,12 @@ export default {
   }
   .el-select {
     width: 300px;
-    /deep/ .el-input {
+    ::v-deep .el-input {
       width: 300px;
     }
   }
   .activity-box {
-    /deep/ .el-input {
+    ::v-deep .el-input {
       width: 500px !important;
     }
   }

src/views/videoManagement/videoExamine/components/edit-video.vue

@@ -554,7 +554,7 @@ export default {
     width: 150px;
   }
   .activity-box {
-    /deep/ .el-input {
+    ::v-deep .el-input {
       width: 500px !important;
     }
   }

src/views/videoManagement/videoList/components/edit-video.vue

@@ -1029,16 +1029,16 @@ export default {
     width: 150px;
   }
   .activity-box {
-    /deep/ .el-input {
+    ::v-deep .el-input {
       // width: 520px !important;
       width: 100%;
     }
   }
-  /deep/ .el-select {
+  ::v-deep .el-select {
     width: 100%;
     max-height: 146px;
   }
-  /deep/ .el-form-item__content {
+  ::v-deep .el-form-item__content {
     display: flex;
   }
   .form-flex-box {

src/views/videoManagement/videoTimeOnlineList/components/add-video.vue

@@ -237,7 +237,7 @@ export default {
     width: 300px;
   }
   .activity-box {
-    /deep/ .el-input {
+    ::v-deep .el-input {
       width: 500px !important;
     }
   }
@@ -249,7 +249,7 @@ export default {
   }
   .el-select {
     width: 300px;
-    /deep/ .el-input {
+    ::v-deep .el-input {
       width: 300px;
     }
   }

vue.config.js

@@ -25,6 +25,7 @@ module.exports = {
   css: {
     loaderOptions: {
       sass: {
+        implementation: require('sass'),
         data: `@import "@/assets/scss/base.scss";`
       }
     }