@yyp92-cli/template-react-pc 2.2.0 → 2.4.0

package/template/src/utils/download.ts

@@ -0,0 +1,45 @@
+import {isFunction} from 'lodash-es'
+
+// 下载文件
+export const downloadFile = (
+    output: any,
+    downloadFileName: string = '未命名文件',
+    handleCancel: () => void = () => {}
+) => {
+    if (!output && isFunction(handleCancel)) {
+        handleCancel()
+        return
+    }
+  
+    fetch(output, {responseType: 'blob'} as any)
+        .then((res: any) => res?.blob?.())
+        .then((res: any) => {
+            if ((window?.navigator as any)?.msSaveBlob) {
+                const suffix = output?.split?.('.')?.pop?.();
+                downloadFileName = downloadFileName === '未命名文件'
+                    ? downloadFileName + '.' + suffix
+                    : downloadFileName;
+        
+                try {
+                    (window?.navigator as any)?.msSaveBlob(res, downloadFileName);
+                }
+                catch(e) {
+                    
+                }
+            }
+            else {
+                const link = document.createElement('a');
+                link.href = window.URL.createObjectURL(res);
+                link.download = downloadFileName;
+                link.style.display = 'none';
+                document.body.appendChild(link);
+                link.click();
+            }
+        }).catch(e => {
+            // console.error(e)
+            // handleCancel()
+        })
+        .finally(() => {
+            isFunction(handleCancel) && handleCancel()
+        })
+}

package/template/src/utils/filterMenu.ts

@@ -0,0 +1,34 @@
+/**
+ * * 根据权限来生成菜单
+ * @param menu 
+ * @param permissions 
+ * @returns 
+ */
+export const filterMenu = (menu: any[], permissions: string[]) => {
+    const newList: any = []
+
+    menu.forEach((group: any) => {
+        if (permissions.includes(group.key)) {
+            const data = {...group}
+            delete data.hideInMenu
+            delete data.showFullScreen
+
+            if (Array.isArray(data?.children)) {
+                const children = data.children
+                    .filter((item: any) => permissions.includes(item.key) && !item?.hideInMenu)
+                    .map((item: any) => {
+                        const newItem = {...item}
+                        delete newItem.hideInMenu
+                        delete newItem.showFullScreen
+
+                        return newItem
+                    })
+                data.children = children
+            }
+
+            newList.push(data)
+        }
+    })
+
+    return newList
+}

package/template/src/utils/index.ts

@@ -0,0 +1,5 @@
+export * from './download'
+export * from './base64ToBlob'
+export * from './cache'
+export * from './changeTheme'
+export * from './filterMenu'

package/template/src/vite-env.d.ts

@@ -0,0 +1,5 @@
+/// <reference types="vite/client" />
+
+// * 为了解决 导入.tsx结尾的组件报错
+declare module '*.tsx'
+declare module 'loadsh'}

package/template/tsconfig.json

@@ -0,0 +1,45 @@
+{
+  "compilerOptions": {
+    "target": "ES2020",
+    "useDefineForClassFields": true,
+    "lib": ["ES2020", "DOM", "DOM.Iterable"],
+    "module": "ESNext",
+    "skipLibCheck": true,
+
+    /* Bundler mode */
+    /* 
+    * 报错：配置文件报错及 React.StrictNode报错：类型“Element”的参数不能赋给类型“ReactNode”的参数
+    *
+    * 解决：
+    * 1.改为node
+    * 2.删除这行 "resolveJsonModule": true
+    */
+    "moduleResolution": "node",
+
+    /*
+    * import 导入的react报错
+    * 解决： 增加这行："esModuleInterop": true,
+    */
+    "esModuleInterop": true,
+    "allowSyntheticDefaultImports": true,
+    "isolatedModules": true,
+    "noEmit": true,
+    "jsx": "react-jsx",
+
+    /* Linting */
+    "strict": true,
+    "noUnusedLocals": true,
+    "noUnusedParameters": true,
+    "noFallthroughCasesInSwitch": true,
+
+    "baseUrl": ".",
+    "paths": {
+      "@/*": ["src/*"],
+      "@components/*": ["src/components/*"],
+      "@utils/*": ["src/utils/*"]
+      // 其他路径别名...
+    }
+  },
+  "include": ["src"],
+  "references": [{ "path": "./tsconfig.node.json" }]
+}

package/template/tsconfig.node.json

@@ -0,0 +1,10 @@
+{
+  "compilerOptions": {
+    "composite": true,
+    "skipLibCheck": true,
+    "module": "ESNext",
+    "moduleResolution": "node",
+    "allowSyntheticDefaultImports": true
+  },
+  "include": ["vite.config.ts"]
+}

package/template/vite.config.ts

@@ -0,0 +1,49 @@
+import { defineConfig, loadEnv } from 'vite'
+import type {ConfigEnv} from 'vite'
+import react from '@vitejs/plugin-react'
+import path from 'path'
+
+// https://vitejs.dev/config/
+export default defineConfig({
+    base: './',
+    
+    server: {
+        proxy: {
+            '/api': {
+                target: 'https://httpbin.org',
+                changeOrigin: true,
+                rewrite: (path) => path.replace(/^\/api/, '')
+            }
+        }
+    },
+
+    build: {
+        sourcemap: true, 
+        outDir: 'dist'
+    },
+
+    plugins: [
+        react()
+    ],
+
+    css: {
+        preprocessorOptions: {
+            scss: {
+                // 启用现代 API（关键配置）
+                api: 'modern-compiler' 
+            },
+            sass: {
+                // sass 和 scss 都需要配置
+                api: 'modern-compiler' 
+            }
+        }
+    },
+
+    resolve: {
+        alias: {
+            // 在这里添加路径别名
+            '@': path.resolve("./src")
+            // 其他路径别名...
+        },
+    }
+})