fix: 1111

package.json

@@ -5,9 +5,9 @@
   "description": "",
   "scripts": {
     "analyze": "cross-env ANALYZE=1 max build",
-    "build": "max build",
-    "deploy:qa": "cross-env REACT_APP_ENV=dev auto-deploy build -t qa",
-    "deploy:prod": "cross-env REACT_APP_ENV=prod auto-deploy build -t prod",
+    "build": "cross-env REACT_APP_ENV=prod  max build",
+    "deploy:qa": "auto-deploy build -t qa",
+    "deploy:prod": "auto-deploy build -t prod",
     "dev": "npm run start:dev",
     "postinstall": "max setup",
     "precommit": "lint-staged",
@@ -33,8 +33,8 @@
     "@ant-design/pro-layout": "6.38.8",
     "@ant-design/pro-table": "2.76.3",
     "@icon-park/react": "^1.3.3",
-    "@umijs/max": "4.0.0",
-    "@umijs/plugins": "4.0.0",
+    "@umijs/max": "4.0.0-rc.22",
+    "@umijs/plugins": "4.0.0-rc.22",
     "ahooks": "^3.4.1",
     "antd": "4.21.0",
     "antd-img-crop": "^3.16.0",

unocss.config.ts

@@ -19,6 +19,11 @@ export function createConfig({ dev = true } = {}) {
         card: '0 0 13px 0 rgba(74, 53, 107, 0.08)'
       }
     }
+    // preflights: [
+    //   {
+    //     getCSS: () => createEnterPlugin()
+    //   }
+    // ]
     // transformers: [transformerDirectives()]
     // rules: [createEnterPlugin()]
     // variants: [createEnterPlugin()]
@@ -30,48 +35,62 @@ export default createConfig()
  * Used for animation when the element is displayed
  * @param maxOutput The larger the maxOutput output, the larger the generated css volume
  */
-function createEnterPlugin(maxOutput = 10) {
-  const createCss = (index: number, d = 'x') => {
-    const upd = d.toUpperCase()
-    return {
-      [`*> .enter-${d}:nth-child(${index})`]: {
-        transform: `translate${upd}(50px)`
-      },
-      [`*> .-enter-${d}:nth-child(${index})`]: {
-        transform: `translate${upd}(-50px)`
-      },
-      [`* > .enter-${d}:nth-child(${index}),* > .-enter-${d}:nth-child(${index})`]: {
-        'z-index': `${10 - index}`,
-        opacity: '0',
-        animation: `enter-${d}-animation 0.4s ease-in-out 0.3s`,
-        'animation-fill-mode': 'forwards',
-        'animation-delay': `${(index * 1) / 10}s`
-      }
-    }
-  }
-  const handler = () => {
-    const addRawCss = {}
-    for (let index = 1; index < maxOutput; index++) {
-      Object.assign(m, {
-        ...createCss(index, 'x'),
-        ...createCss(index, 'y')
-      })
-    }
-    return {
-      ...addRawCss,
-      [`@keyframes enter-x-animation`]: {
-        to: {
-          opacity: '1',
-          transform: 'translateX(0)'
-        }
-      },
-      [`@keyframes enter-y-animation`]: {
-        to: {
-          opacity: '1',
-          transform: 'translateY(0)'
-        }
-      }
-    }
-  }
-  return [/^enter-(x|y)/, () => handler()]
-}
+// function createEnterPlugin(maxOutput = 10): string {
+//   const createCss = (index: number, d = 'x') => {
+//     const upd = d.toUpperCase()
+//     return {
+//       [`*> .enter-${d}:nth-child(${index})`]: {
+//         transform: `translate${upd}(50px)`
+//       },
+//       [`*> .-enter-${d}:nth-child(${index})`]: {
+//         transform: `translate${upd}(-50px)`
+//       },
+//       [`* > .enter-${d}:nth-child(${index}),* > .-enter-${d}:nth-child(${index})`]: {
+//         'z-index': `${10 - index}`,
+//         opacity: '0',
+//         animation: `enter-${d}-animation 0.4s ease-in-out 0.3s`,
+//         'animation-fill-mode': 'forwards',
+//         'animation-delay': `${(index * 1) / 10}s`
+//       }
+//     }
+//   }
+//   const handler = () => {
+//     const addRawCss = {}
+//     for (let index = 1; index < maxOutput; index++) {
+//       Object.assign(addRawCss, {
+//         ...createCss(index, 'x'),
+//         ...createCss(index, 'y')
+//       })
+//     }
+//     const entriesToCss = (arr?: CSSEntries) => {
+//       if (!arr) return ''
+//       return clearIdenticalEntries(arr)
+//         .map(([key, value]) => {
+//           if (isObject(value)) {
+//             return value !== null ? `${key} {${entriesToCss(normalizeCSSEntries(value))}}` : undefined
+//           }
+//           return value !== null ? `${key}:${value};` : undefined
+//         })
+//         .filter(Boolean)
+//         .join('')
+//     }
+//     return entriesToCss(
+//       normalizeCSSEntries({
+//         ...addRawCss,
+//         [`@keyframes enter-x-animation`]: {
+//           to: {
+//             opacity: '1',
+//             transform: 'translateX(0)'
+//           }
+//         },
+//         [`@keyframes enter-y-animation`]: {
+//           to: {
+//             opacity: '1',
+//             transform: 'translateY(0)'
+//           }
+//         }
+//       })
+//     )
+//   }
+//   return handler()
+// }

windi.config.ts

@@ -1,81 +0,0 @@
-// windi.config.js
-import { defineConfig } from 'windicss/helpers'
-import lineClamp from 'windicss/plugin/line-clamp'
-import colors from 'windicss/colors'
-import proSettings from './config/defaultSettings'
-
-export default defineConfig({
-  extract: {
-    exclude: ['node_modules', '.git', 'dist', 'mock', '.umi']
-  },
-  darkMode: 'class',
-  plugins: [lineClamp, createEnterPlugin()],
-  theme: {
-    extend: {
-      colors: {
-        ...colors,
-        primary: proSettings.primaryColor
-      },
-      screens: {
-        sm: '576px',
-        md: '768px',
-        lg: '992px',
-        xl: '1200px',
-        '2xl': '1600px'
-      },
-      boxShadow: {
-        card: '0 0 13px 0 rgba(74, 53, 107, 0.08)'
-      }
-    }
-  }
-})
-
-/**
- * Used for animation when the element is displayed
- * @param maxOutput The larger the maxOutput output, the larger the generated css volume
- */
-function createEnterPlugin(maxOutput = 10) {
-  const createCss = (index: number, d = 'x') => {
-    const upd = d.toUpperCase()
-    return {
-      [`*> .enter-${d}:nth-child(${index})`]: {
-        transform: `translate${upd}(50px)`
-      },
-      [`*> .-enter-${d}:nth-child(${index})`]: {
-        transform: `translate${upd}(-50px)`
-      },
-      [`* > .enter-${d}:nth-child(${index}),* > .-enter-${d}:nth-child(${index})`]: {
-        'z-index': `${10 - index}`,
-        opacity: '0',
-        animation: `enter-${d}-animation 0.4s ease-in-out 0.3s`,
-        'animation-fill-mode': 'forwards',
-        'animation-delay': `${(index * 1) / 10}s`
-      }
-    }
-  }
-  const handler = ({ addBase }) => {
-    const addRawCss = {}
-    for (let index = 1; index < maxOutput; index++) {
-      Object.assign(addRawCss, {
-        ...createCss(index, 'x'),
-        ...createCss(index, 'y')
-      })
-    }
-    addBase({
-      ...addRawCss,
-      [`@keyframes enter-x-animation`]: {
-        to: {
-          opacity: '1',
-          transform: 'translateX(0)'
-        }
-      },
-      [`@keyframes enter-y-animation`]: {
-        to: {
-          opacity: '1',
-          transform: 'translateY(0)'
-        }
-      }
-    })
-  }
-  return { handler }
-}