fix: 修复style variables

.umirc.js

@@ -65,6 +65,7 @@ export default {
     edge: false,
     ios: false,
   },
+  dynamicImport: {},
   theme: {
     '@s-site-menu-width': '258px',
   },

package.json

@@ -119,7 +119,7 @@
     "stylelint": "^13.0.0",
     "terser-webpack-plugin": "^5.1.1",
     "typescript": "^4.1.2",
-    "umi": "^3.4.0",
+    "umi": "^3.5.20",
     "umi-request": "^1.3.5",
     "umi-test": "^1.9.6",
     "umi-types": "^0.5.11",

packages/base-components/BasicChart/src/index.less

-@import (reference) '../../../../node_modules/antd/es/style/themes/default';
+@import '~antd/es/style/themes/default';
 @basic-chart-prefix-cls: ~'@{ant-prefix}-basic-chart';
 
 .@{basic-chart-prefix-cls} {

packages/base-components/BasicTable/src/index.less

-@import (reference) '../../../../node_modules/antd/es/style/themes/default';
+@import '~antd/es/style/themes/default';
 @basic-table-prefix-cls: ~'@{ant-prefix}-basic-table';
 
 .@{basic-table-prefix-cls} {

packages/base-components/DatePickerCustom/src/index.js

-import React, { useContext, useEffect, useState } from 'react';
-import PropTypes from 'prop-types';
-import classNames from 'classnames';
+// eslint-disable-next-line no-unused-vars
+import React from 'react';
 import moment from 'moment';
+// eslint-disable-next-line no-unused-vars
 import { DatePicker } from 'antd';
 const FORMATS = {
   day: 'YYYY-MM-DD',
@@ -57,7 +57,9 @@ const DatePickerCustom = (props) => {
         }
         break;
       case 'week':
+        // eslint-disable-next-line no-use-before-define
         name = getMonthWeek(value);
+        // eslint-disable-next-line no-use-before-define
         if (value.format('YYYY-wo') === getTime(0, 'week', FORMATS[modes])) {
           name = '本周';
         } else if (value.format('YYYY-wo') === getTime(1, 'week', FORMATS[modes])) {

packages/base-components/DeviceTree/src/index.less

-@import (reference) '../../../../node_modules/antd/es/style/themes/default';
+@import '~antd/es/style/themes/default';
 @device-tree-prefix-cls: ~'@{ant-prefix}-device-tree';
 
 .@{device-tree-prefix-cls} {
@@ -8,31 +8,31 @@
   height: 100%;
   padding: 5px;
 
-  .ant-divider {
+  .@{ant-prefix}-divider {
     margin: 6px 0 12px 0;
   }
 
-  .ant-tree-checkbox {
+  .@{ant-prefix}-tree-checkbox {
     margin: 7px 2px 0 0;
   }
 
-  .ant-tree-title {
+  .@{ant-prefix}-tree-title {
     white-space: nowrap;
   }
 
-  .ant-tree-treenode {
+  .@{ant-prefix}-tree-treenode {
     width: 100%;
   }
 
-  .ant-tree-switcher {
+  .@{ant-prefix}-tree-switcher {
     line-height: 30px;
   }
 
-  .ant-tree-switcher-noop {
+  .@{ant-prefix}-tree-switcher-noop {
     width: 14px;
   }
 
-  .ant-tree-node-content-wrapper {
+  .@{ant-prefix}-tree-node-content-wrapper {
     flex: 1;
     min-height: 30px;
     overflow: hidden;
@@ -41,7 +41,7 @@
     border-radius: 3px;
   }
 
-  .ant-tree .ant-tree-node-content-wrapper.ant-tree-node-selected {
+  .@{ant-prefix}-tree .@{ant-prefix}-tree-node-content-wrapper.@{ant-prefix}-tree-node-selected {
     color: #1890ff;
     background-color: #eaf1fe;
   }

packages/base-components/Empty/src/index.js

+// eslint-disable-next-line no-unused-vars
 import React, { useContext } from 'react';
 import classNames from 'classnames';
 import PropTypes from 'prop-types';
@@ -9,9 +10,11 @@ import errorDark from './assets/errorDark.png';
 import './index.less';
 
 const Empty = ({ description, image, theme, size, statusCode, imageStyle, children }) => {
-  const alt = description ? description : 'empty';
-  const des = description ? description : DESC_DATA[`${statusCode}`];
-  const imageSrc = image ? image : IMAGE_DATA[theme][statusCode == '0' ? 0 : 1];
+  const alt = description || 'empty';
+  // eslint-disable-next-line no-use-before-define
+  const des = description || DESC_DATA[`${statusCode}`];
+  // eslint-disable-next-line no-use-before-define
+  const imageSrc = image || IMAGE_DATA[theme][statusCode == '0' ? 0 : 1];
 
   const { getPrefixCls } = useContext(ConfigProvider.ConfigContext);
   const prefixCls = getPrefixCls('panda-empty');

packages/base-components/Empty/src/index.less

-@import (reference) '../../../../node_modules/antd/es/style/themes/default';
+@import '~antd/es/style/themes/default';
 @panda-empty-prefix-cls: ~'@{ant-prefix}-panda-empty';
 
 .@{panda-empty-prefix-cls} {

packages/base-components/HistoryInfo/src/index.less

-@import (reference) '../../../../node_modules/antd/es/style/themes/default';
+@import '~antd/es/style/themes/default';
 @history-info-prefix-cls: ~'@{ant-prefix}-history-info';
 
 .@{history-info-prefix-cls} {
   height: 100%;
 
-  .ant-tabs,
-  .ant-tabs-content {
+  .@{ant-prefix}-tabs,
+  .@{ant-prefix}-tabs-content {
     height: 100%;
   }
 
@@ -47,8 +47,8 @@
       right: -20px;
     }
 
-    .ant-radio-group,
-    .ant-select {
+    .@{ant-prefix}-radio-group,
+    .@{ant-prefix}-select {
       margin-right: 16px;
     }
 

packages/base-components/ImageSelect/src/index.less

-@import (reference) '../../../../node_modules/antd/es/style/themes/default';
+@import '~antd/es/style/themes/default';
 @image-select-prefix-cls: ~'@{ant-prefix}-image-select';
 
 .@{image-select-prefix-cls} {
@@ -41,22 +41,22 @@
     white-space: nowrap;
   }
 
-  .ant-input-affix-wrapper {
+  .@{ant-prefix}-input-affix-wrapper {
     width: 313px;
     height: 29px;
     background-color: #eef1f9;
     border-radius: 15px;
 
-    .ant-input-prefix {
+    .@{ant-prefix}-input-prefix {
       color: #5a6c8a;
     }
 
-    .ant-input {
+    .@{ant-prefix}-input {
       background: #eef1f9;
     }
   }
 
-  .ant-input-affix-wrapper:hover {
+  .@{ant-prefix}-input-affix-wrapper:hover {
     background-color: #eef1f9;
   }
 
@@ -108,7 +108,7 @@
     white-space: nowrap;
   }
 
-  .ant-modal-body {
+  .@{ant-prefix}-modal-body {
     max-height: 600px;
     overflow-y: auto;
   }

packages/base-components/QuotaSelect/src/index.less

-@import (reference) '../../../../node_modules/antd/es/style/themes/default';
+@import '~antd/es/style/themes/default';
 @quota-select-prefix-cls: ~'@{ant-prefix}-quota-select';
 
 .@{quota-select-prefix-cls} {
@@ -35,7 +35,7 @@
     background-color: #eef1f9;
     border-radius: 15px;
 
-    .ant-input-prefix {
+    .@{ant-prefix}-input-prefix {
       color: #5a6c8a;
     }
   }
@@ -87,8 +87,8 @@
     height: calc(100% - 47px);
     overflow-y: auto;
 
-    .ant-tree-treenode,
-    .ant-tree-node-content-wrapper {
+    .@{ant-prefix}-tree-treenode,
+    .@{ant-prefix}-tree-node-content-wrapper {
       width: 100%;
     }
   }

packages/base-components/RealTimeInfo/src/index.less

-@import (reference) '../../../../node_modules/antd/es/style/themes/default';
+@import '~antd/es/style/themes/default';
 @realtime-info-prefix-cls: ~'@{ant-prefix}-realtime-info';
 
 .@{realtime-info-prefix-cls} {

packages/base-components/TimeRangePicker/src/index.less

-@import (reference) '../../../../node_modules/antd/es/style/themes/default';
+@import '~antd/es/style/themes/default';
 @time-range-picker-prefix-cls: ~'@{ant-prefix}-time-range-picker';
 
 .@{time-range-picker-prefix-cls} {

packages/extend-components/EC_ConfigurationView/src/index.less

-@import (reference) '../../../../node_modules/antd/es/style/themes/default';
+@import '~antd/es/style/themes/default';
 @ec-configuration-view-prefix-cls: ~'@{ant-prefix}-ec-configuration-view';
 
 .@{ec-configuration-view-prefix-cls} {
@@ -68,34 +68,34 @@
       }
 
       //:global {
-      .ant-input-affix-wrapper {
+      .@{ant-prefix}-input-affix-wrapper {
         background: #1c202c;
         border: none;
       }
 
-      .ant-input-affix-wrapper:focus,
-      .ant-input-affix-wrapper-focused {
+      .@{ant-prefix}-input-affix-wrapper:focus,
+      .@{ant-prefix}-input-affix-wrapper-focused {
         box-shadow: none;
       }
 
-      .ant-input:focus {
+      .@{ant-prefix}-input:focus {
         border: none;
         box-shadow: none;
       }
 
-      .ant-input,
-      .ant-btn {
+      .@{ant-prefix}-input,
+      .@{ant-prefix}-btn {
         color: white;
         background: #1c202c;
         border: none;
       }
 
-      .ant-input-group-addon {
+      .@{ant-prefix}-input-group-addon {
         background: #1c202c;
         border: none;
       }
 
-      .ant-input-suffix {
+      .@{ant-prefix}-input-suffix {
         color: #646977;
       }
       //}
@@ -112,7 +112,7 @@
 
         //:global {
 
-        .ant-col.ant-form-item-label {
+        .@{ant-prefix}-col.@{ant-prefix}-form-item-label {
           margin-right: 10px;
 
           label {
@@ -120,39 +120,39 @@
           }
         }
 
-        .ant-form-item-control-input-content {
+        .@{ant-prefix}-form-item-control-input-content {
           display: flex;
           align-items: center;
         }
 
-        .ant-input-affix-wrapper {
+        .@{ant-prefix}-input-affix-wrapper {
           background: #1c202c;
           border: none;
         }
 
-        .ant-input-affix-wrapper:focus,
-        .ant-input-affix-wrapper-focused {
+        .@{ant-prefix}-input-affix-wrapper:focus,
+        .@{ant-prefix}-input-affix-wrapper-focused {
           box-shadow: none;
         }
 
-        .ant-input:focus {
+        .@{ant-prefix}-input:focus {
           border: none;
           box-shadow: none;
         }
 
-        .ant-input,
-        .ant-btn {
+        .@{ant-prefix}-input,
+        .@{ant-prefix}-btn {
           color: white;
           background: #1c202c;
           border: none;
         }
 
-        .ant-input-group-addon {
+        .@{ant-prefix}-input-group-addon {
           background: #1c202c;
           border: none;
         }
 
-        .ant-input-suffix {
+        @{ant-prefix}-input-suffix {
           color: #646977;
         }
       }
@@ -164,36 +164,36 @@
     }
 
     //:global{
-    .ant-modal-content {
+    .@{ant-prefix}-modal-content {
       color: white;
       background: #282d3b;
       border: 1px solid #31374a;
 
-      .ant-modal-close {
+      .@{ant-prefix}-modal-close {
         color: white;
       }
 
-      .ant-modal-close-x {
+      .@{ant-prefix}-modal-close-x {
         line-height: 42px;
       }
 
-      .ant-modal-header {
+      .@{ant-prefix}-modal-header {
         background: none;
         border-color: #1c202c;
 
-        .ant-modal-title {
+        .@{ant-prefix}-modal-title {
           color: white;
         }
       }
 
-      .ant-modal-body {
+      .@{ant-prefix}-modal-body {
       }
 
-      .ant-modal-footer {
+      .@{ant-prefix}-modal-footer {
         background: none;
         border-color: #1c202c;
 
-        .ant-btn:first-of-type {
+        .@{ant-prefix}-btn:first-of-type {
           color: white;
           background-color: #838a9d;
           border: none;
@@ -209,7 +209,7 @@
 
   .historyInfoModal {
     //:global {
-    .ant-modal-body {
+    .@{ant-prefix}-modal-body {
       height: 680px;
     }
     //}
@@ -220,29 +220,29 @@
 
     //:global {
 
-    .ant-modal {
+    .@{ant-prefix}-modal {
       padding-bottom: 0;
     }
 
-    .ant-modal,
-    .ant-modal-content {
+    .@{ant-prefix}-modal,
+    .@{ant-prefix}-modal-content {
       background: #282d3b;
     }
 
-    .ant-modal-content {
+    .@{ant-prefix}-modal-content {
       height: 100%;
     }
 
-    .ant-modal-header {
+    .@{ant-prefix}-modal-header {
       background: #282d3b;
     }
 
-    .ant-modal-title,
-    .ant-modal-close-x {
+    .@{ant-prefix}-modal-title,
+    .@{ant-prefix}-modal-close-x {
       color: white;
     }
 
-    .ant-modal-body {
+    .@{ant-prefix}-modal-body {
       height: calc(100% - 55px);
     }
   }

packages/extend-components/EC_DeviceTree/src/index.less

-@import (reference) '../../../../node_modules/antd/es/style/themes/default';
+@import '~antd/es/style/themes/default';
 @ec-device-tree-prefix-cls: ~'@{ant-prefix}-ec-device-tree';
 
 .@{ec-device-tree-prefix-cls} {
@@ -12,27 +12,27 @@
     margin: 6px 0 12px 0;
   }
 
-  .ant-tree-checkbox {
+  .@{ant-prefix}-tree-checkbox {
     margin: 7px 2px 0 0;
   }
 
-  .ant-tree-title {
+  .@{ant-prefix}-tree-title {
     white-space: nowrap;
   }
 
-  .ant-tree-treenode {
+  .@{ant-prefix}-tree-treenode {
     width: 100%;
   }
 
-  .ant-tree-switcher {
+  .@{ant-prefix}-tree-switcher {
     line-height: 30px;
   }
 
-  .ant-tree-switcher-noop {
+  .@{ant-prefix}-tree-switcher-noop {
     width: 14px;
   }
 
-  .ant-tree-node-content-wrapper {
+  .@{ant-prefix}-tree-node-content-wrapper {
     flex: 1;
     min-height: 30px;
     overflow: hidden;
@@ -41,7 +41,7 @@
     border-radius: 3px;
   }
 
-  .ant-tree .ant-tree-node-content-wrapper.ant-tree-node-selected {
+  .@{ant-prefix}-tree .@{ant-prefix}-tree-node-content-wrapper.@{ant-prefix}-tree-node-selected {
     color: #1890ff;
     background-color: #eaf1fe;
   }
@@ -51,7 +51,7 @@
     overflow-y: scroll;
   }
 
-  .ant-spin-nested-loading {
+  .@{ant-prefix}-spin-nested-loading {
     height: 100%;
   }
 
@@ -59,13 +59,13 @@
     margin: 10px auto;
   }
 
-  &-total.ant-divider-horizontal.ant-divider-with-text {
+  &-total.@{ant-prefix}-divider-horizontal.@{ant-prefix}-divider-with-text {
     margin: 10px auto;
     color: #a4b1c7;
   }
 
-  .ant-divider-horizontal.ant-divider-with-text::before,
-  .ant-divider-horizontal.ant-divider-with-text::after {
+  .@{ant-prefix}-divider-horizontal.@{ant-prefix}-divider-with-text::before,
+  .@{ant-prefix}-divider-horizontal.@{ant-prefix}-divider-with-text::after {
     top: 0;
   }
 }

packages/extend-components/EC_HistoryInfo/src/index.less

-@import (reference) '../../../../node_modules/antd/es/style/themes/default';
+@import '~antd/es/style/themes/default';
 @history-info-prefix-cls: ~'@{ant-prefix}-history-info';
 
 .@{history-info-prefix-cls} {
   height: 100%;
 
-  .ant-tabs,
-  .ant-tabs-content {
+  .@{ant-prefix}-tabs,
+  .@{ant-prefix}-tabs-content {
     height: 100%;
   }
 
@@ -22,13 +22,13 @@
     height: calc(100% - 108px);
   }
 
-  &-spin > .ant-spin-container {
+  &-spin > .@{ant-prefix}-spin-container {
     display: flex;
     flex: 1;
     overflow: hidden;
   }
 
-  &-spin > div > .ant-spin {
+  &-spin > div > .@{ant-prefix}-spin {
     max-height: none;
   }
 
@@ -71,8 +71,8 @@
       right: -20px;
     }
 
-    .ant-radio-group,
-    .ant-select {
+    .@{ant-prefix}-radio-group,
+    .@{ant-prefix}-select {
       margin-right: 16px;
     }
 

packages/extend-components/EC_QuotaSelect/src/index.less

-@import (reference) '../../../../node_modules/antd/es/style/themes/default';
+@import '~antd/es/style/themes/default';
 @ec-quota-select-prefix-cls: ~'@{ant-prefix}-ec-quota-select';
 
 .@{ec-quota-select-prefix-cls} {
@@ -43,7 +43,7 @@
     background-color: #eef1f9;
     border-radius: 15px;
 
-    .ant-input-prefix {
+    .@{ant-prefix}-input-prefix {
       color: #5a6c8a;
     }
   }
@@ -111,8 +111,8 @@
     height: calc(100% - 47px);
     overflow-y: auto;
 
-    .ant-tree-treenode,
-    .ant-tree-node-content-wrapper {
+    .@{ant-prefix}-tree-treenode,
+    .@{ant-prefix}-tree-node-content-wrapper {
       width: 100%;
     }
   }

packages/extend-components/EC_RealTimeInfo/src/index.less

-@import (reference) '../../../../node_modules/antd/es/style/themes/default';
+@import '~antd/es/style/themes/default';
 @realtime-info-prefix-cls: ~'@{ant-prefix}-realtime-info';
 
 .@{realtime-info-prefix-cls} {
   padding: 10px;
 
-  .ant-btn-link {
+  .@{ant-prefix}-btn-link {
     color: #d0d6e8;
   }
 
@@ -32,30 +32,30 @@
 }
 
 .@{realtime-info-prefix-cls}-modal {
-  .ant-modal-header {
+  .@{ant-prefix}-modal-header {
     height: 63px;
     padding: 16px 48px 0 24px;
   }
 
   &-title {
-    .ant-tabs-nav {
+    .@{ant-prefix}-tabs-nav {
       margin: 0;
     }
 
-    .ant-tabs-nav:before {
+    .@{ant-prefix}-tabs-nav:before {
       border: none;
     }
 
-    .ant-tabs-extra-content {
+    .@{ant-prefix}-tabs-extra-content {
       margin-right: 10px;
     }
 
-    .ant-tabs-content-holder {
+    .@{ant-prefix}-tabs-content-holder {
       display: none;
     }
   }
 
-  .ant-modal-content {
+  .@{ant-prefix}-modal-content {
     height: 705px;
   }