refactor: umi配置更新以及样式更新

.npmrc

@@ -0,0 +1 @@
+strict-peer-dependencies=false

config/config.ts

@@ -1,17 +1,17 @@
 // https://umijs.org/config/
 
-const prodGzipList = ['js', 'css', 'html']
-
-import { defineConfig } from '@umijs/max'
-import defaultSettings from './defaultSettings'
 import proxy from './proxy'
 import routes from './routes'
+import { defineConfig } from '@umijs/max'
+const CompressionPlugin = require('compression-webpack-plugin')
+const prodGzipList = ['js', 'css', 'html']
 const { REACT_APP_ENV } = process.env
+
 export default defineConfig({
   plugins: [require.resolve('@umijs/plugins/dist/unocss')],
   npmClient: 'pnpm',
   hash: true,
-  antd: { import: true },
+  antd: {},
   model: {},
   moment2dayjs: {},
   request: {},
@@ -27,19 +27,18 @@ export default defineConfig({
   // Fast Refresh 热更新
   theme: { 'primary-color': '#886ab5' },
   layout: {},
+  deadCode: {}, // 检测未使用的文件和导出，仅在 build 阶段开启
   locale: {
     default: 'zh-CN',
     antd: false,
     baseNavigator: false
   },
   define: { REACT_APP_ENV: REACT_APP_ENV || false },
-  targets: { ie: 11 },
   routes,
   title: false,
   proxy: proxy[REACT_APP_ENV || 'dev'],
   manifest: { basePath: '/' },
   extraBabelPlugins: [
-    ['import', { libraryName: 'antd', libraryDirectory: 'es', style: true }, 'antd'],
     [
       'import',
       {
@@ -48,42 +47,30 @@ export default defineConfig({
         camel2DashComponentName: false
       },
       '@icon-park/react'
+    ],
+    [
+      'import',
+      {
+        libraryName: 'antd',
+        libraryDirectory: 'es',
+        style: 'less'
+      },
+      'antd'
     ]
   ],
-  externals: {
+  externals: REACT_APP_ENV !== 'dev' && {
     react: 'React',
     'react-dom': 'ReactDOM'
   },
   chainWebpack(config, { env }) {
-    if (env === 'production') {
-      // config.merge({
-      //   optimization: {
-      //     minimize: true,
-      //     splitChunks: {
-      //       chunks: 'all',
-      //       minSize: 30000,
-      //       minChunks: 2,
-      //       automaticNameDelimiter: '.',
-      //       cacheGroups: {
-      //         vendor: {
-      //           name: 'vendors',
-      //           test: ({ resource }) => /[\\/]node_modules[\\/]/.test(resource),
-      //           chunks: 'all',
-      //           priority: 20
-      //         }
-      //       }
-      //     }
-      //   }
-      // })
-      config.plugin('compression-webpack-plugin').use(
-        new CompressionPlugin({
-          // filename: 文件名称，这里我们不设置，让它保持和未压缩的文件同一个名称
-          algorithm: 'gzip', // 指定生成gzip格式
-          test: new RegExp('\\.(' + prodGzipList.join('|') + ')$'), // 匹配哪些格式文件需要压缩
-          threshold: 10000, //对超过10k的数据进行压缩
-          minRatio: 0.6 // 压缩比例，值为0 ~ 1
-        })
-      )
-    }
+    config.plugin('compression-webpack-plugin').use(
+      new CompressionPlugin({
+        // filename: 文件名称，这里我们不设置，让它保持和未压缩的文件同一个名称
+        algorithm: 'gzip', // 指定生成gzip格式
+        test: new RegExp('\\.(' + prodGzipList.join('|') + ')$'), // 匹配哪些格式文件需要压缩
+        threshold: 10000, //对超过10k的数据进行压缩
+        minRatio: 0.6 // 压缩比例，值为0 ~ 1
+      })
+    )
   }
 })

package.json

@@ -28,7 +28,6 @@
   ],
   "dependencies": {
     "@ant-design/icons": "^4.7.0",
-    "@ant-design/pro-descriptions": "^1.10.60",
     "@ant-design/pro-form": "1.66.0",
     "@ant-design/pro-layout": "6.38.8",
     "@ant-design/pro-table": "2.76.3",
@@ -54,8 +53,9 @@
     "@types/lodash": "^4.14.181",
     "@types/react": "^18.0.0",
     "@types/react-dom": "^18.0.0",
-    "@unocss/cli": "^0.44.2",
+    "@unocss/cli": "^0.45.21",
     "babel-plugin-import": "^1.13.3",
+    "compression-webpack-plugin": "^10.0.0",
     "cross-env": "^7.0.3",
     "eslint": "^8.17.0",
     "husky": "^8.0.0",
@@ -63,7 +63,7 @@
     "prettier": "^2.6.1",
     "stylelint": "^14.9.0",
     "typescript": "^4.6.3",
-    "unocss": "^0.44.2"
+    "unocss": "^0.45.21"
   },
   "engines": {
     "node": ">=14.0.0"

src/pages/Business/Attendance/index.tsx

@@ -165,7 +165,7 @@ const Attendance: React.FC = () => {
       <div className="h-full w-full flex flex-row">
         <ShowTitleMenu onSelect={onSelect} options={titleOptions} defaultValue={0} />
         <div className={classNames('w-max-3/4 w-3/4')}>
-          <div className="ml-8 bg-white p-4 shadow-md shadow-hex-3e2c5a relative">
+          <div className="ml-8 bg-white p-4 shadow-md relative">
             {state.menuId === 0 ? (
               <>
                 <div className="absolute right-7 top-7 z-100">

src/pages/Business/CommonSetting/index.tsx

@@ -55,7 +55,7 @@ const CommonSetting: React.FC = () => {
       <div className="h-full w-full flex flex-row">
         <ShowTitleMenu onSelect={onSelect} options={titleOptions} defaultValue={0} />
         <div className={classNames('w-max-3/4 w-3/4')}>
-          <div className="ml-8 bg-white p-4 shadow-md shadow-hex-3e2c5a relative">
+          <div className="ml-8 bg-white p-4 shadow-md  relative">
             <div>
               <div className="text-xl font-bold">服务记录编辑删除限时</div>
               <div className="my-4 text-gray-500 text-opacity-50">

src/pages/Business/Contact/index.tsx

@@ -323,7 +323,7 @@ const Contact: React.FC = () => {
           defaultValue={1}
         />
         <div className={classNames('w-max-3/4 w-3/4')}>
-          <div className="ml-8 bg-white p-4 shadow-md shadow-hex-3e2c5a relative">
+          <div className="ml-8 bg-white p-4 shadow-md  relative">
             {state.menuId === 1 ? (
               <>
                 <div className="pb-3 border-b border-b-black border-opacity-8 mb-3 flex items-center justify-between">

src/pages/Business/Invoice/index.tsx

@@ -217,7 +217,7 @@ const Invoice: React.FC = () => {
       <div className="h-full w-full flex flex-row">
         <ShowTitleMenu onSelect={onSelect} options={[{ label: '开票内容', value: 1 }]} defaultValue={1} />
         <div className={classNames('w-max-3/4 w-3/4')}>
-          <div className="ml-8 bg-white p-4 shadow-md shadow-hex-3e2c5a relative">
+          <div className="ml-8 bg-white p-4 shadow-md  relative">
             <div className="absolute right-4 top-4 z-100">
               <Button
                 type="primary"

src/pages/Business/Notification/index.tsx

@@ -81,7 +81,7 @@ const Notification: React.FC = () => {
       <div className="h-full w-full flex flex-row">
         <ShowTitleMenu options={[{ label: '通知', value: 1 }]} defaultValue={1} />
         <div className="w-max-3/4">
-          <div className="ml-8 bg-white shadow-md shadow-hex-3e2c5a relative">
+          <div className="ml-8 bg-white shadow-md  relative">
             {/* <div className="pb-3 border-b border-b-black border-opacity-8 mb-3 flex items-center justify-between">
             <div>通知推送</div>
           </div> */}

src/pages/Role/Customer/index.tsx

@@ -171,7 +171,7 @@ const Customer = () => {
       <div className="h-full w-full flex flex-row">
         <RoleMenu menuId={menuId} onSelect={onSelect} itemCount={state.roleStaff?.length || 0} />
         <div className={classNames('w-max-3/4 w-3/4', styles.formItemWrap)}>
-          <div className="ml-8 bg-white p-4 shadow-md shadow-hex-3e2c5a relative">
+          <div className="ml-8 bg-white p-4 shadow-md  relative">
             <div className="absolute right-4 top-4 z-100">
               {state.id && (
                 <ConnectModal

src/pages/Role/Hr/index.tsx

@@ -162,7 +162,7 @@ const Hr = () => {
       <div className="h-full w-full flex flex-row">
         <RoleMenu menuId={menuId} onSelect={onSelect} itemCount={state.roleStaff?.length || 0} />
         <div className={classNames('w-max-3/4 w-3/4', styles.formItemWrap)}>
-          <div className="ml-8 bg-white p-4 shadow-md shadow-hex-3e2c5a relative">
+          <div className="ml-8 bg-white p-4 shadow-md  relative">
             <div className="absolute right-4 top-4 z-100">
               {state.id && (
                 <ConnectModal

src/pages/Role/Product/index.tsx

@@ -163,7 +163,7 @@ const Product = () => {
       <div className="h-full w-full flex flex-row">
         <RoleMenu menuId={menuId} onSelect={onSelect} itemCount={state.roleStaff?.length || 0} />
         <div className={classNames('w-max-3/4 w-3/4', styles.formItemWrap)}>
-          <div className="ml-8 bg-white p-4 shadow-md shadow-hex-3e2c5a relative">
+          <div className="ml-8 bg-white p-4 shadow-md  relative">
             <div className="absolute right-4 top-4 z-100">
               {state.id && (
                 <ConnectModal

src/pages/Role/Statistic/index.tsx

@@ -164,7 +164,7 @@ const Statistic = () => {
       <div className="h-full w-full flex flex-row">
         <RoleMenu menuId={menuId} onSelect={onSelect} itemCount={state.roleStaff?.length || 0} />
         <div className={classNames('w-max-3/4 w-3/4', styles.formItemWrap)}>
-          <div className="ml-8 bg-white p-4 shadow-md shadow-hex-3e2c5a relative">
+          <div className="ml-8 bg-white p-4 shadow-md  relative">
             <div className="absolute right-4 top-4 z-100">
               {state.id && (
                 <ConnectModal

src/pages/Role/System/index.tsx

@@ -133,7 +133,7 @@ const System = () => {
       <div className="h-full w-full flex flex-row">
         <RoleMenu menuId={menuId} onSelect={onSelect} itemCount={state.roleStaff?.length || 0} />
         <div className={classNames('w-max-3/4 w-3/4', styles.formItemWrap)}>
-          <div className="ml-8 bg-white p-4 shadow-md shadow-hex-3e2c5a relative">
+          <div className="ml-8 bg-white p-4 shadow-md  relative">
             <div className="absolute right-4 top-4 z-100">
               {state.id && (
                 <ConnectModal

src/pages/Role/Workbench/index.tsx

@@ -142,7 +142,7 @@ const Workbench = () => {
       <div className="h-full w-full flex flex-row">
         <RoleMenu menuId={menuId} onSelect={onSelect} itemCount={state.roleStaff?.length || 0} />
         <div className={classNames('w-max-3/4 w-3/4', styles.formItemWrap)}>
-          <div className="ml-8 bg-white p-4 shadow-md shadow-hex-3e2c5a relative">
+          <div className="ml-8 bg-white p-4 shadow-md  relative">
             <div className="absolute right-4 top-4 z-100">
               {state.id && (
                 <ConnectModal