修复(hook): 修改hook

.commitlint.js

@@ -0,0 +1,3 @@
+module.exports = {
+  extends: ["@nicecode/commit-lint"],
+};

.eslintignore

@@ -0,0 +1,3 @@
+build/
+dist/
+.umi

.eslintrc.js

@@ -1,4 +1,36 @@
 module.exports = {
-  extends: [require.resolve('uniubi-lint/typescript/react')],
+  extends: [
-  rules: {},
+    "alloy",
+    "alloy/react",
+    "alloy/typescript"
+  ],
+  plugins: [
+    "@typescript-eslint/eslint-plugin"
+  ],
+  parser: "@typescript-eslint/parser",
+  parserOptions: {
+    ecmaVersion: 2020,
+  },
+  "env": {
+      // 您的环境变量（包含多个预定义的全局变量）
+      // Your environments (which contains several predefined global variables)
+      //
+      // browser: true,
+      // node: true,
+      // mocha: true,
+      // jest: true,
+      // jquery: true
+  },
+  "globals": {
+      // 您的全局变量（设置为 false 表示它不允许被重新赋值）
+      // Your global variables (setting to false means it's not allowed to be reassigned)
+      //
+      // myGlobal: false
+  },
+  "rules": {
+      // 自定义您的规则
+      // Customize your rules
+    "react/jsx-no-useless-fragment": 0,
+    "@typescript-eslint/no-require-imports": 0
+  }
 };

.prettierrc.js

@@ -0,0 +1,37 @@
+module.exports = {
+    // 一行最多 100 字符
+    printWidth: 100,
+    // 使用 4 个空格缩进
+    tabWidth: 4,
+    // 不使用缩进符，而使用空格
+    useTabs: false,
+    // 行尾需要有分号
+    semi: true,
+    // 使用单引号
+    singleQuote: true,
+    // 对象的 key 仅在必要时用引号
+    quoteProps: 'as-needed',
+    // jsx 不使用单引号，而使用双引号
+    jsxSingleQuote: false,
+    // 末尾不需要逗号
+    trailingComma: 'none',
+    // 大括号内的首尾需要空格
+    bracketSpacing: true,
+    // jsx 标签的反尖括号需要换行
+    jsxBracketSameLine: false,
+    // 箭头函数，只有一个参数的时候，也需要括号
+    arrowParens: 'always',
+    // 每个文件格式化的范围是文件的全部内容
+    rangeStart: 0,
+    rangeEnd: Infinity,
+    // 不需要写文件开头的 @prettier
+    requirePragma: false,
+    // 不需要自动在文件开头插入 @prettier
+    insertPragma: false,
+    // 使用默认的折行标准
+    proseWrap: 'preserve',
+    // 根据显示样式决定 html 要不要折行
+    htmlWhitespaceSensitivity: 'css',
+    // 换行符使用 lf
+    endOfLine: 'lf'
+};

.umirc.ts

@@ -1,14 +1,14 @@
 import { defineConfig } from 'umi';
-import Icon from './public/favicon.ico'
 
 export default defineConfig({
-  favicon: Icon,
+  favicon: '#',
   hash: true,
   dva: {
     immer: true,
     hmr: false,
   },
   webpack5: {},
+  mfsu: {},
   dynamicImport: {
     loading: '@/components/PageLoading/index',
   },

.vscode/settings.json

@@ -1,40 +1,35 @@
 {
-  "editor.codeActionsOnSave": {
+    "editor.codeActionsOnSave": {
-    "source.fixAll.eslint": true
+        "source.fixAll.eslint": true
-  },
+    },
-  "eslint.validate": [
+    "editor.formatOnSave": true,
-    "javascript",
+    "editor.defaultFormatter": "esbenp.prettier-vscode",
-    "react",
+    "eslint.validate": ["javascript", "react", "typescript", "typescriptreact", "vue"],
-    "typescript",
+    "[typescriptreact]": {
-    "typescriptreact",
+        "editor.defaultFormatter": null
-    "vue"
+    },
-  ],
+    "[javascript]": {
-  "editor.formatOnSave": true,
+        "editor.defaultFormatter": null
-  "[typescriptreact]": {
+    },
-    "editor.defaultFormatter": null
+    "[typescript]": {
-  },
+        "editor.defaultFormatter": null
-  "[javascript]": {
+    },
-    "editor.defaultFormatter": null
+    "[javascriptreact]": {
-  },
+        "editor.defaultFormatter": null
-  "[typescript]": {
+    },
-    "editor.defaultFormatter": null
+    "[json]": {
-  },
+        "editor.defaultFormatter": "esbenp.prettier-vscode"
-  "[javascriptreact]": {
+    },
-    "editor.defaultFormatter": null
+    "[less]": {
-  },
+        "editor.defaultFormatter": "esbenp.prettier-vscode"
-  "[json]": {
+    },
-    "editor.defaultFormatter": "esbenp.prettier-vscode"
+    "[scss]": {
-  },
+        "editor.defaultFormatter": "esbenp.prettier-vscode"
-  "[less]": {
+    },
-    "editor.defaultFormatter": "esbenp.prettier-vscode"
+    "[css]": {
-  },
+        "editor.defaultFormatter": "esbenp.prettier-vscode"
-  "[scss]": {
+    },
-    "editor.defaultFormatter": "esbenp.prettier-vscode"
+    "[jsonc]": {
-  },
+        "editor.defaultFormatter": "esbenp.prettier-vscode"
-  "[css]": {
+    }
-    "editor.defaultFormatter": "esbenp.prettier-vscode"
-  },
-  "[jsonc]": {
-    "editor.defaultFormatter": "esbenp.prettier-vscode"
-  }
 }

package.json

@@ -11,7 +11,18 @@
     "lint:fix": "eslint 'src/**/*.{js,jsx,tsx,ts}' --fix",
     "prettier": "prettier --write '**/*.{less,css,md,json}'",
     "test": "umi-test",
-    "test:coverage": "umi-test --coverage"
+    "test:coverage": "umi-test --coverage",
+    "cz": "git add . && git cz"
+  },
+  "config": {
+    "commitizen": {
+      "path": "@nicecode/commit"
+    }
+  },
+  "husky": {
+    "hooks": {
+      "commit-msg": "commitlint -E HUSKY_GIT_PARAMS"
+    }
   },
   "gitHooks": {
     "pre-commit": "tsc --noEmit && lint-staged"
@@ -27,26 +38,30 @@
     ]
   },
   "dependencies": {
+    "@ant-design/icons": "^4.7.0",
     "@ant-design/pro-layout": "^6.15.4",
-    "@materials/user-avatar": "^1.0.1",
+    "antd": "^4.20.6",
-    "@ant-design/icons-react": "^2.0.10",
-    "antd": "^100.0.1",
     "axios": "^0.19.2",
     "classnames": "^2.2.6",
     "js-cookie": "^2.2.1",
-    "poseidon-web-monitoring": "^1.1.3",
     "react": "^17.0.1",
     "react-dom": "^17.0.1",
     "umi": "^3.5.15"
   },
   "devDependencies": {
+    "@nicecode/commit-lint": "^0.1.2",
     "@types/classnames": "^2.2.10",
+    "@typescript-eslint/eslint-plugin": "^5.26.0",
+    "@typescript-eslint/parser": "^5.26.0",
     "@umijs/preset-react": "1.x",
     "@umijs/test": "^3.0.16",
     "babel-plugin-transform-remove-console": "^6.9.4",
+    "commitlint": "^17.0.1",
     "cross-env": "^7.0.2",
-    "end-type-to-front-type": "^1.2.1",
     "eslint": "^7.16.0",
+    "eslint-config-alloy": "^4.5.1",
+    "eslint-plugin-react": "^7.30.0",
+    "husky": "^8.0.1",
     "lint-staged": "^10.0.7",
     "prettier": "^1.19.1",
     "typescript": "^4.1.3",

src/app.ts

@@ -1,5 +1,2 @@
-import { enableES5 } from 'immer';
 import '@/styles/index.less';
 import '@/styles/reset.less';
-
-enableES5();

src/components/User/index.tsx

@@ -1,12 +1,10 @@
-import UserAvatar from '@materials/user-avatar';
+function User() {
-
-const User = () => {
   return (
-    <UserAvatar name="admin">
+    <>
       <div>个人中心</div>
       <div>退出登录</div>
-    </UserAvatar>
+    </>
   );
-};
+}
 
 export default User;

src/interfaces/base.ts

@@ -1,3 +1,5 @@
+import React from 'react';
+
 export interface BaseProps {
   className?: string;
   style?: React.CSSProperties;

src/layouts/BasicLayout/BreadcrumbItem.tsx

@@ -2,7 +2,7 @@ import React from 'react';
 import { history } from 'umi';
 import { Button } from 'antd';
 import { ButtonProps } from 'antd/lib/button';
-import { HomeFilled } from '@ant-design/icons-react';
+import { HomeOutlined } from '@ant-design/icons';
 import classnames from 'classnames';
 import './index.less';
 
@@ -15,7 +15,7 @@ const BreadcrumbItem = ({
   children,
   className,
   ...rest
-}: BreadcrumbItemProps): JSX.Element => {
+}: BreadcrumbItemProps) => {
   return (
     <Button
       className={classnames('g-basic-layout-header-breadcrumb-item', className)}
@@ -39,7 +39,7 @@ const RootItem: React.FC<ButtonProps> = ({ className, ...rest }) => (
     onClick={() => history.push('/')}
     {...rest}
   >
-    <HomeFilled />
+    <HomeOutlined />
   </Button>
 );
 

src/layouts/BasicLayout/index.less

@@ -1,84 +1,84 @@
-@import "../../styles/var.less";
+@import '../../styles/var.less';
 
 .g-basic-layout {
-  &-header {
+    &-header {
-    display: flex;
+        display: flex;
 
-    &-breadcrumb {
+        &-breadcrumb {
-      .g-basic-layout-header-breadcrumb-item {
+            .g-basic-layout-header-breadcrumb-item {
-        color: @M4;
+                color: @M4;
-        padding: 0;
+                padding: 0;
 
-        &:active {
+                &:active {
-          color: @M4;
+                    color: @M4;
+                }
+
+                &:hover {
+                    color: @S3;
+                    background-color: @M7;
+                }
+
+                &:focus {
+                    background-color: @M7;
+                }
+
+                &-active {
+                    color: @M2;
+
+                    &[disabled],
+                    &[disabled]:hover,
+                    &[disabled]:focus,
+                    &[disabled]:active {
+                        color: @M2;
+                        cursor: default;
+                    }
+                }
+            }
+
+            .g-basic-layout-header-breadcrumb-divider {
+                color: @M4;
+                margin: 0 @Sp-3;
+            }
         }
-
-        &:hover {
-          color: @S3;
-          background-color: @M7;
-        }
-
-        &:focus {
-          background-color: @M7;
-        }
-
-        &-active {
-          color: @M2;
-
-          &[disabled],
-          &[disabled]:hover,
-          &[disabled]:focus,
-          &[disabled]:active {
-            color: @M2;
-            cursor: default;
-          }
-        }
-      }
-
-      .g-basic-layout-header-breadcrumb-divider {
-        color: @M4;
-        margin: 0 @Sp-3;
-      }
-    }
-  }
-
-  .ant-pro-sider-logo img {
-    width: 32px;
-    height: 32px;
-  }
-
-  .ant-pro-global-header {
-    background-color: @M7;
-    box-shadow: none;
-  }
-
-  .ant-pro-basicLayout-content {
-    margin: @Sp-5 @Sp-8;
-  }
-
-  .ant-page-header-heading {
-    &-left {
-      margin: 0;
     }
 
-    &-title {
+    .ant-pro-sider-logo img {
-      font-size: @Fs-4;
+        width: 32px;
-      line-height: @Lh-4;
+        height: 32px;
     }
-  }
 
-  .ant-layout {
+    .ant-pro-global-header {
-    background-color: @M7;
+        background-color: @M7;
-  }
+        box-shadow: none;
+    }
 
-  .ant-layout-sider,
+    .ant-pro-basicLayout-content {
-  .ant-menu.ant-menu-dark,
+        margin: @Sp-5 @Sp-8;
-  .ant-menu-dark .ant-menu-sub,
+    }
-  .ant-menu.ant-menu-dark .ant-menu-sub {
-    background-color: @S1;
-  }
 
-  .ant-layout-content {
+    .ant-page-header-heading {
-    min-height: calc(100vh - 72px);
+        &-left {
-  }
+            margin: 0;
+        }
+
+        &-title {
+            font-size: @Fs-4;
+            line-height: @Lh-4;
+        }
+    }
+
+    .ant-layout {
+        background-color: @M7;
+    }
+
+    .ant-layout-sider,
+    .ant-menu.ant-menu-dark,
+    .ant-menu-dark .ant-menu-sub,
+    .ant-menu.ant-menu-dark .ant-menu-sub {
+        background-color: @S1;
+    }
+
+    .ant-layout-content {
+        min-height: calc(100vh - 72px);
+    }
 }

src/layouts/BasicLayout/index.tsx

@@ -1,15 +1,20 @@
 import React from 'react';
 import { history, Link } from 'umi';
-import { EntranceOutlined } from '@ant-design/icons-react';
+import { EnterOutlined } from '@ant-design/icons';
 import ProLayout, { MenuDataItem } from '@ant-design/pro-layout';
 import { HeaderViewProps } from '@ant-design/pro-layout/lib/Header';
-import User from '@/components/User';
+// import User from '@/components/User';
 import Breadcrumb from './Breadcrumb';
 import './index.less';
 
-const BasicLayout: React.FC = ({ children, ...rest }) => {
+
+interface IBasicLayout {
+  children: React.ReactNode
+}
+
+const BasicLayout: React.FC<IBasicLayout> = ({ children, ...rest }: any) => {
   const iconMap = {
-    EntranceOutlined: <EntranceOutlined />,
+    EnterOutlined: <EnterOutlined />,
   };
 
   // 带子菜单的一级导航
@@ -52,13 +57,13 @@ const BasicLayout: React.FC = ({ children, ...rest }) => {
   };
 
   // 用户信息
-  const renderUserAvatar = () => <User />;
+  // const renderUserAvatar = () => <User />;
 
   return (
     <ProLayout
       className="g-basic-layout"
-      logo="https://fe-cloud.uni-ubi.com/image/1625038486292-logo-r.png?x-oss-process=img/q/80"
+      logo="http://jzx-h5.oss-cn-hangzhou.aliyuncs.com/static/pill.png?x-oss-process=img/q/80"
-      title="Uni-Ubi"
+      title="nicecode"
       siderWidth={180}
       fixedHeader
       fixSiderbar
@@ -66,7 +71,7 @@ const BasicLayout: React.FC = ({ children, ...rest }) => {
       subMenuItemRender={renderSubMenuItem}
       menuItemRender={renderMenuItem}
       headerContentRender={renderHeaderContent}
-      rightContentRender={renderUserAvatar}
+      // rightContentRender={renderUserAvatar}
       {...rest}
     >
       {children}

src/layouts/BlankLayout/index.tsx

@@ -1,5 +1,9 @@
 import React from 'react';
 
-const BlankLayout: React.FC = ({ children }) => <>{children}</>;
+interface IBlankLayout {
+  children: React.ReactNode
+}
+
+const BlankLayout: React.FC<IBlankLayout> = ({ children }) => (<>{children}</>);
 
 export default BlankLayout;

src/layouts/WindowLayout/Header.tsx

@@ -3,13 +3,13 @@ import { Image, Divider } from 'antd';
 import User from '@/components/User';
 import './index.less';
 
-const Header = () => {
+function Header() {
   return (
     <div className="g-window-layout-header">
       <div
         className="g-window-layout-header-logo"
         onClick={() => history.push('/')}
-      >  
+      >
         <Image
           src={require('../../assets/images/logo.png')}
           alt="logo"
@@ -28,6 +28,6 @@ const Header = () => {
       </div>
     </div>
   );
-};
+}
 
 export default Header;

src/layouts/WindowLayout/index.less

@@ -1,65 +1,65 @@
-@import "../../styles/var.less";
+@import '../../styles/var.less';
 
 @headerHeader: 64px;
 
 .g-window-layout {
-  display: flex;
-  flex-direction: column;
-  min-width: 1200px;
-  min-height: 100vh;
-  background-color: @M7;
-
-  &-header {
     display: flex;
-    justify-content: space-between;
+    flex-direction: column;
-    align-items: center;
+    min-width: 1200px;
-    height: @headerHeader;
+    min-height: 100vh;
-    width: 1200px;
+    background-color: @M7;
-    margin: 0 auto;
 
-    &-wrapper {
+    &-header {
-      background-color: #000000;
+        display: flex;
+        justify-content: space-between;
+        align-items: center;
+        height: @headerHeader;
+        width: 1200px;
+        margin: 0 auto;
+
+        &-wrapper {
+            background-color: #000000;
+        }
+
+        &-logo {
+            display: flex;
+            justify-content: center;
+            align-items: center;
+            color: #ffffff;
+            cursor: pointer;
+
+            &-divider.ant-divider {
+                border-color: #ffffff;
+                height: 12px;
+                margin: 0 @Sp-5;
+            }
+
+            &-text {
+                font-size: @Fs-3;
+            }
+        }
+
+        &-actions {
+            color: #fff;
+        }
     }
 
-    &-logo {
+    &-content {
-      display: flex;
+        flex: 1;
-      justify-content: center;
+        width: 1200px;
-      align-items: center;
+        min-height: 600px;
-      color: #ffffff;
+        margin: 0 auto;
-      cursor: pointer;
+        padding: @Sp-8;
+        background-color: #ffffff;
+        box-shadow: @Sh-2;
+        border-radius: @Ra-2;
 
-      &-divider.ant-divider {
+        &-wrapper {
-        border-color: #ffffff;
+            display: flex;
-        height: 12px;
+            flex-direction: column;
-        margin: 0 @Sp-5;
+            flex: 1;
-      }
+            min-height: 500px;
-
+            padding: @Sp-8 0;
-      &-text {
+        }
-        font-size: @Fs-3;
-      }
     }
-
-    &-actions {
-      color: #fff;
-    }
-  }
-
-  &-content {
-    flex: 1;
-    width: 1200px;
-    min-height: 600px;
-    margin: 0 auto;
-    padding: @Sp-8;
-    background-color: #ffffff;
-    box-shadow: @Sh-2;
-    border-radius: @Ra-2;
-
-    &-wrapper {
-      display: flex;
-      flex-direction: column;
-      flex: 1;
-      min-height: 500px;
-      padding: @Sp-8 0;
-    }
-  }
 }

src/layouts/WindowLayout/index.tsx

@@ -2,7 +2,11 @@ import React from 'react';
 import Header from './Header';
 import './index.less';
 
-const WindowLayout: React.FC = ({ children }) => {
+interface IWindowLayout {
+  children: React.ReactNode
+}
+
+const WindowLayout: React.FC<IWindowLayout> = ({ children }) => {
   return (
     <div className="g-window-layout">
       <div className="g-window-layout-header-wrapper">

src/pages/index.less

@@ -1,3 +1,5 @@
 .title {
-  background: rgb(121, 242, 157);
+    margin: 100px auto;
+    text-align: center;
+    // background: rgb(121, 242, 157);
 }

src/pages/index.tsx

@@ -1,9 +1,9 @@
 import styles from './index.less';
 
-export default () => {
+export default function () {
   return (
     <div>
-      <h1 className={styles.title}>index</h1>
+      <h1 className={styles.title}>welcome! there is nicecode!</h1>
     </div>
   );
-};
+}

src/styles/index.less

@@ -1 +1 @@
-@import "./var.less";
+@import './var.less';

src/styles/reset.less

@@ -1,15 +1,15 @@
-@import "var.less";
+@import 'var.less';
 
 .ant-picker {
-  width: 100%;
+    width: 100%;
 }
 
 .ant-pagination {
-  display: flex;
+    display: flex;
-  justify-content: flex-end;
+    justify-content: flex-end;
-  width: 100%;
+    width: 100%;
 
-  &-total-text {
+    &-total-text {
-    flex: 1;
+        flex: 1;
-  }
+    }
 }

src/wrappers/SecurityWrapper.tsx

@@ -5,6 +5,7 @@ import { ConnectState } from '@/models/connect';
 export interface SecurityWrapperProps {
   token: string;
   dispatch: Dispatch;
+  children: React.ReactNode
 }
 
 const SecurityWrapper: React.FC<SecurityWrapperProps> = ({

tsconfig.json

@@ -1,34 +1,26 @@
 {
-  "compilerOptions": {
+    "compilerOptions": {
-    "outDir": "build/dist",
+        "outDir": "build/dist",
-    "module": "esnext",
+        "module": "esnext",
-    "target": "esnext",
+        "target": "esnext",
-    "lib": ["esnext", "dom"],
+        "lib": ["esnext", "dom"],
-    "sourceMap": true,
+        "sourceMap": true,
-    "baseUrl": ".",
+        "baseUrl": ".",
-    "jsx": "react-jsx",
+        "jsx": "react-jsx",
-    "allowSyntheticDefaultImports": true,
+        "allowSyntheticDefaultImports": true,
-    "moduleResolution": "node",
+        "moduleResolution": "node",
-    "forceConsistentCasingInFileNames": true,
+        "forceConsistentCasingInFileNames": true,
-    "noImplicitReturns": true,
+        "noImplicitReturns": true,
-    "suppressImplicitAnyIndexErrors": true,
+        "suppressImplicitAnyIndexErrors": true,
-    "noUnusedLocals": true,
+        "noUnusedLocals": true,
-    "allowJs": true,
+        "allowJs": true,
-    "skipLibCheck": true,
+        "skipLibCheck": true,
-    "experimentalDecorators": true,
+        "experimentalDecorators": true,
-    "strict": true,
+        "strict": true,
-    "paths": {
+        "paths": {
-      "@/*": ["./src/*"],
+            "@/*": ["./src/*"],
-      "@@/*": ["./src/.umi/*"]
+            "@@/*": ["./src/.umi/*"]
-    }
+        }
-  },
+    },
-  "exclude": [
+    "exclude": ["node_modules", "build", "dist", "scripts", "src/.umi/*", "webpack", "jest"]
-    "node_modules",
-    "build",
-    "dist",
-    "scripts",
-    "src/.umi/*",
-    "webpack",
-    "jest"
-  ]
 }

typings.d.ts

@@ -3,3 +3,4 @@ declare module '*.less';
 declare module '*.png';
 declare module '*.jpeg';
 declare module '*.jpg';
+declare module 'immer'