Feat 4.x lint (#368)

* feat: lint config

* style: eslint fix

* style: stylelint fix

Author: liuxy0551

.dumi/global.less

@@ -1 +1 @@
-@import 'antd/dist/antd.css';
+@import "antd/dist/antd.css";

.dumi/pages/index/index.scss

@@ -1,40 +1,34 @@
-@import '../../theme/style/const.scss';
+@import "../../theme/style/const.scss";
 
 .dtc-homepage {
-    background-color: #ebf5fd;
+    background-color: #EBF5FD;
     height: calc(100vh - 64px);
     display: flex;
     flex-direction: column;
     justify-content: center;
     text-align: center;
-
     .dtc-homepage-title {
         font-size: 70px;
         color: $basic-black-color;
         user-select: none;
         margin-bottom: 12px;
         line-height: 1.15;
     }
-
     .dtc-homepage-badges {
         margin-bottom: 12px;
-
         img:not(:last-child) {
             margin-inline-end: 20px;
         }
     }
-
     .dtc-homepage-description {
         color: $basic-black-color;
         font-size: 30px;
     }
-
     .dtc-homepage-btnGroups {
         margin: 12px auto 0;
         display: grid;
         grid-gap: 18px;
         grid-template-columns: 1fr 1fr;
-
         > .ant-btn {
             font-size: 20px;
             height: 40px;
@@ -46,15 +40,12 @@
 @media only screen and (max-width: 767px) {
     .dtc-homepage {
         height: calc(100vh - 52px);
-
         .dtc-homepage-title {
             font-size: 60px;
         }
-
         .dtc-homepage-description {
             font-size: 26px;
         }
-
         .dtc-homepage-btnGroups {
             > .ant-btn {
                 font-size: 16px;

.dumi/pages/index/index.tsx

@@ -1,7 +1,8 @@
 import React from 'react';
-import { Link, Helmet } from 'dumi';
-import { Button } from 'antd';
 import { GithubOutlined } from '@ant-design/icons';
+import { Button } from 'antd';
+import { Helmet, Link } from 'dumi';
+
 import './index.scss';
 
 export default function Homepage() {

.dumi/theme/layouts/DocLayout.scss

@@ -1,5 +1,5 @@
 .dumi-default-doc-layout {
-    background: #ebf5fd;
+    background: #EBF5FD;
 }
 
 .dumi-default-doc-layout > main {

.dumi/theme/layouts/DocLayout.tsx

@@ -1,5 +1,6 @@
 import React from 'react';
 import DumiDocLayout from 'dumi/theme-default/layouts/DocLayout';
+
 import 'dumi/theme-default/layouts/DocLayout/index.less';
 import './DocLayout.scss';
 

.dumi/theme/slots/Footer/index.scss

@@ -1,41 +1,34 @@
-@import '../../style/const.scss';
+@import "../../style/const.scss";
 
 .dtc-footer {
     margin-top: 16px;
     background: rgb(250, 250, 252);
-
     .dtc-footer-links {
         padding-top: 20px;
         display: flex;
         flex-wrap: wrap;
         justify-content: center;
-
         .dtc-footer-rows {
             width: 200px;
             flex-shrink: 0;
             display: flex;
             flex-direction: column;
-
             .dtc-footer-rows-title {
                 line-height: 28px;
                 font-size: 14px;
-                color: #8b8fa8;
+                color: #8B8FA8;
             }
-
             .dtc-footer-col {
                 line-height: 28px;
-
                 > a {
                     color: $basic-black-color;
                 }
             }
         }
     }
-
     .dtc-footer-divider {
         margin: 0 48px;
     }
-
     .dtc-footer-copyright {
         text-align: center;
         font-size: 14px;

.dumi/theme/slots/Footer/index.tsx

@@ -1,6 +1,7 @@
 import React from 'react';
 import { Divider } from 'antd';
 import { useSiteData } from 'dumi';
+
 import './index.scss';
 
 export default function Footer() {
@@ -14,6 +15,7 @@ export default function Footer() {
                         <a
                             href="https://github.com/DTStack/dt-react-component/blob/master/CHANGELOG.md"
                             target="_blank"
+                            rel="noreferrer"
                         >
                             更新日志
                         </a>
@@ -22,6 +24,7 @@ export default function Footer() {
                         <a
                             href="https://github.com/DTStack/dt-react-component/issues"
                             target="_blank"
+                            rel="noreferrer"
                         >
                             报告 Bug
                         </a>
@@ -30,25 +33,29 @@ export default function Footer() {
                 <div className="dtc-footer-rows">
                     <span className="dtc-footer-rows-title">相关链接</span>
                     <div className="dtc-footer-col">
-                        <a href="https://www.dtstack.com/" target="_blank">
+                        <a href="https://www.dtstack.com/" target="_blank" rel="noreferrer">
                             袋鼠云
                         </a>
                     </div>
                     <div className="dtc-footer-col">
-                        <a href="http://ued.dtstack.cn/" target="_blank">
+                        <a href="http://ued.dtstack.cn/" target="_blank" rel="noreferrer">
                             数栈前端团队
                         </a>
                     </div>
                     <div className="dtc-footer-col">
-                        <a href="https://4x.ant.design/index-cn" target="_blank">
+                        <a href="https://4x.ant.design/index-cn" target="_blank" rel="noreferrer">
                             Ant Design 4
                         </a>
                     </div>
                 </div>
                 <div className="dtc-footer-rows">
                     <span className="dtc-footer-rows-title">社区</span>
                     <div className="dtc-footer-col">
-                        <a href="https://github.com/DTStack/dt-react-component" target="_blank">
+                        <a
+                            href="https://github.com/DTStack/dt-react-component"
+                            target="_blank"
+                            rel="noreferrer"
+                        >
                             Github
                         </a>
                     </div>

.dumi/theme/slots/Header/index.scss

@@ -1,50 +1,44 @@
-@import '../../style/const.scss';
+@import "../../style/const.scss";
 
 @media only screen and (min-width: 767px) {
     #root {
         // reset dumi style
         .dumi-default-header {
             background-color: rgba(255, 255, 255, 0.75);
-            box-shadow: 0 1px 2px 0 rgb(0 0 0 / 3%), 0 1px 6px -1px rgb(0 0 0 / 2%),
-                0 2px 4px 0 rgb(0 0 0 / 2%);
+            box-shadow:
+                0 1px 2px 0 rgba(0, 0, 0, 0.03),
+                0 1px 6px -1px rgba(0, 0, 0, 0.02),
+                0 2px 4px 0 rgba(0, 0, 0, 0.02);
         }
-
         .dumi-default-header-content {
             height: 64px;
             max-width: 100vw;
         }
-
         .dumi-default-header-left {
             width: auto;
         }
-
         .dumi-default-header-right {
             justify-content: end;
             align-items: center;
             gap: 14px;
         }
-
         .dumi-default-logo {
             font-size: 18px;
             font-weight: 600;
             color: $basic-black-color;
-
             img {
                 height: 40px;
             }
         }
-
         .dumi-default-navbar > li {
             font-size: $navbar-font-size;
             padding: 0 $navbar-font-size;
-
             &:not(:last-child) {
                 margin-inline-end: 0;
             }
             a {
                 color: $basic-black-color;
             }
-
             a.active {
                 color: $primary-color;
             }

.dumi/theme/slots/Header/index.tsx

@@ -1,12 +1,13 @@
 import React, { useState } from 'react';
+import { CloseOutlined, GithubOutlined, MenuOutlined } from '@ant-design/icons';
+import { Button, Tooltip } from 'antd';
 import { useRouteMeta } from 'dumi';
+import LangSwitch from 'dumi/theme-default/slots/LangSwitch';
 import Logo from 'dumi/theme-default/slots/Logo';
 import Navbar from 'dumi/theme-default/slots/Navbar';
-import SearchBar from 'dumi/theme-default/slots/SearchBar';
-import LangSwitch from 'dumi/theme-default/slots/LangSwitch';
 import RtlSwitch from 'dumi/theme-default/slots/RtlSwitch';
-import { Button, Tooltip } from 'antd';
-import { CloseOutlined, MenuOutlined, GithubOutlined } from '@ant-design/icons';
+import SearchBar from 'dumi/theme-default/slots/SearchBar';
+
 import { useMobile } from '../../hooks';
 import 'dumi/theme-default/slots/Header/index.less';
 import './index.scss';
@@ -39,6 +40,7 @@ export default function Header() {
                             className="dtc-github-icon"
                             href="https://github.com/DTStack/dt-react-component"
                             target="_blank"
+                            rel="noreferrer"
                         >
                             Github
                         </a>
@@ -50,7 +52,7 @@ export default function Header() {
                                 icon={<GithubOutlined />}
                                 href="https://github.com/DTStack/dt-react-component"
                                 target="_blank"
-                            ></Button>
+                            />
                         </Tooltip>
                     )}
                 </section>

.dumi/theme/slots/Sidebar/index.scss

@@ -1,16 +1,15 @@
-@import '../../style/const.scss';
+@import "../../style/const.scss";
 
 @media only screen and (min-width: 767px) {
     .dumi-default-sidebar {
         height: 100vh;
         max-height: calc(100vh - 64px);
-        background-color: #fff;
+        background-color: #FFF;
         top: 64px;
         width: 275px;
-        border-right: 1px solid #f2f2f2;
+        border-right: 1px solid #F2F2F2;
         padding-right: 0;
         padding-left: 0;
-
         > dl {
             > dt {
                 padding: 2px 16px;
@@ -19,30 +18,26 @@
                 font-size: 13px;
                 margin: 2px 0;
             }
-
             > dd {
                 height: 40px;
                 line-height: 40px;
                 font-size: $sidebar-font-size;
                 margin: 4px;
                 box-sizing: content-box;
                 padding: 0;
-
                 > a {
                     font-size: inherit;
                     line-height: inherit;
                     padding: 0 12px;
                     margin: 0;
                     border-radius: 8px;
                     color: $basic-black-color;
-
                     &:hover {
                         background-color: rgba(0, 0, 0, 0.06);
                     }
-
                     &.active {
                         color: inherit;
-                        background-color: #bae0ff;
+                        background-color: #BAE0FF;
                         font-weight: normal;
                     }
                 }