create-packer 1.40.0 → 1.41.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "create-packer",
-  "version": "1.40.0",
+  "version": "1.41.0",
   "main": "index.js",
   "repository": "https://github.com/kevily/create-packer",
   "author": "1k <bug_zero@163.com>",

package/template/web-app/vue/router/index.ts

@@ -1,4 +1,4 @@
-import { createRouter, createWebHashHistory, RouteRecordRaw } from 'vue-router'
+import { createRouter, createWebHistory, RouteRecordRaw } from 'vue-router'
 import names from './names'
 import * as homeRouter from './home'
 
@@ -21,6 +21,6 @@ const routes: RouteRecordRaw[] = [
 export { default as routerNames } from './names'
 
 export const router = createRouter({
-    history: createWebHashHistory(),
+    history: createWebHistory(import.meta.env.PUBLIC_BASE_URL),
     routes
 })

package/template/web-app/vue-rsbuild/.editorconfig

@@ -0,0 +1,14 @@
+# editorconfig.org
+
+root = true
+
+[*]
+charset = utf-8
+indent_size = 4
+indent_style = space
+insert_final_newline = true
+trim_trailing_whitespace = true
+
+
+[*.md]
+trim_trailing_whitespace = false

package/template/web-app/vue-rsbuild/.env

@@ -0,0 +1,2 @@
+PUBLIC_BASE_URL=/
+PUBLIC_API_HOST=

package/template/web-app/vue-rsbuild/.env.development

@@ -0,0 +1,2 @@
+PUBLIC_BASE_URL=/dev
+PUBLIC_API_HOST=/api

package/template/web-app/vue-rsbuild/.gitignore

@@ -0,0 +1,27 @@
+# Logs
+logs
+*.log
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+pnpm-debug.log*
+lerna-debug.log*
+
+node_modules
+dist
+dist-ssr
+*.local
+stats.html
+vite.config.ts.*
+
+# Editor directories and files
+.vscode/*
+!.vscode/extensions.json
+.history
+.idea
+.DS_Store
+*.suo
+*.ntvs*
+*.njsproj
+*.sln
+*.sw?

package/template/web-app/vue-rsbuild/.husky/commit-msg

@@ -0,0 +1,4 @@
+#!/usr/bin/env sh
+. "$(dirname -- "$0")/_/husky.sh"
+
+npx --no -- commitlint --edit 

package/template/web-app/vue-rsbuild/.husky/pre-commit

@@ -0,0 +1,4 @@
+#!/usr/bin/env sh
+. "$(dirname -- "$0")/_/husky.sh"
+
+npm run lint

package/template/web-app/vue-rsbuild/.prettierignore

@@ -0,0 +1,6 @@
+**/*.md
+**/*.svg
+**/*.ejs
+**/*.html
+.history
+dist

package/template/web-app/vue-rsbuild/.prettierrc

@@ -0,0 +1,18 @@
+{
+    "overrides": [
+        {
+            "files": ".prettierrc",
+            "options": { "parser": "json" }
+        }
+    ],
+    "printWidth": 100,
+    "tabWidth": 4,
+    "useTabs": false,
+    "semi": false,
+    "singleQuote": true,
+    "trailingComma": "none",
+    "bracketSpacing": true,
+    "bracketSameLine": false,
+    "arrowParens": "avoid",
+    "rangeStart": 0
+}

package/template/web-app/vue-rsbuild/.stylelintignore

@@ -0,0 +1,4 @@
+node_modules
+/dist
+/.vscode
+/.history

package/template/web-app/vue-rsbuild/.stylelintrc

@@ -0,0 +1,29 @@
+{
+    "extends": "stylelint-config-standard-scss",
+    "rules": {
+        "comment-empty-line-before": "never",
+        "no-empty-source": null,
+        "alpha-value-notation": null,
+        "color-function-notation": null,
+        "at-rule-no-unknown": [
+            true,
+            {
+                "ignoreAtRules": ["tailwind", "apply", "use"]
+            }
+        ],
+        "declaration-block-no-redundant-longhand-properties": null,
+        "selector-pseudo-class-no-unknown": [
+            true,
+            {
+                "ignorePseudoClasses": ["global"]
+            }
+        ],
+        "selector-class-pattern": null,
+        "scss/at-rule-no-unknown": [
+            true,
+            {
+                "ignoreAtRules": ["tailwind", "apply"]
+            }
+        ]
+    }
+}

package/template/web-app/vue-rsbuild/.vscode/extensions.json

@@ -0,0 +1,9 @@
+{
+    "recommendations": [
+        "vue.volar",
+        "vue.vscode-typescript-vue-plugin",
+        "dbaeumer.vscode-eslint",
+        "stylelint.vscode-stylelint",
+        "esbenp.prettier-vscode"
+    ]
+}

package/template/web-app/vue-rsbuild/README.md

@@ -0,0 +1,14 @@
+## Vite + Vue3.x + Typescript
+
+### Features
+
+-   Vite
+-   Vue
+-   Typescript
+-   vue-router
+-   pinia
+-   Tailwindcss
+-   Eslint
+-   Prettier
+-   axios
+-   Alias @ to <project_root>/src

package/template/web-app/vue-rsbuild/commitlint.config.cjs

@@ -0,0 +1 @@
+module.exports = { extends: ['@commitlint/config-conventional'] }

package/template/web-app/vue-rsbuild/domain/app/app.ts

@@ -0,0 +1,4 @@
+import { createApp } from 'vue'
+import { App } from './components'
+
+export default createApp(App)

package/template/web-app/vue-rsbuild/domain/app/components/app.vue

@@ -0,0 +1,18 @@
+<template>
+    <router-view />
+</template>
+
+<script setup lang="ts">
+import { router, routerNames } from '@/router'
+
+router.beforeEach(async to => {
+    if (!Object.values(routerNames).includes(to.name as string)) {
+        return {
+            replace: true,
+            name: routerNames.notFound
+        }
+    }
+})
+</script>
+
+<style scoped></style>

package/template/web-app/vue-rsbuild/domain/app/components/index.ts

@@ -0,0 +1 @@
+export { default as App } from './app.vue'

package/template/web-app/vue-rsbuild/domain/app/createComponentInstance.ts

@@ -0,0 +1,44 @@
+import { createVNode, render, VNodeChild } from 'vue'
+import { assign, keys } from 'lodash-es'
+import app from './app'
+
+const store = new Map()
+
+function reset(oldObj: Record<string, any>, newObj: Record<string, any>) {
+    keys(oldObj).forEach(k => {
+        oldObj[k] = void 0
+    })
+    assign(oldObj, newObj)
+}
+
+export function createComponentInstance<
+    P extends Record<string, any>,
+    E extends Record<string, any>,
+    Slots extends Record<string, () => VNodeChild> = Record<string, () => VNodeChild>
+>(name: string, component: any, props?: P, slots?: Slots) {
+    let vNode = store.get(name)
+    function updateProps(props: Partial<P>) {
+        reset(vNode.component.props, props)
+    }
+
+    function updateSlots(slots: Partial<Record<string, () => VNodeChild>>) {
+        reset(vNode.component.slots, slots)
+    }
+
+    if (!vNode) {
+        const container = document.createElement('div')
+        vNode = createVNode(component, props, slots)
+        vNode.appContext = app._context || {}
+        store.set(name, vNode)
+        render(vNode, container)
+    } else {
+        updateProps(props || {})
+        updateSlots(slots || {})
+    }
+    return {
+        instance: vNode,
+        updateProps,
+        updateSlots,
+        ...(vNode.component?.exposed as E)
+    }
+}

package/template/web-app/vue-rsbuild/domain/app/index.ts

@@ -0,0 +1,3 @@
+export { default as app } from './app'
+export * from './components'
+export * from './createComponentInstance'

package/template/web-app/vue-rsbuild/env.d.ts

@@ -0,0 +1,17 @@
+/// <reference types="@rsbuild/core/types" />
+
+declare module '*.vue' {
+    import type { DefineComponent } from 'vue'
+    const component: DefineComponent<Record<string, any>, Record<string, any>, any>
+    export default component
+}
+
+interface ImportMetaEnv {
+    readonly PUBLIC_BASE_URL: string
+    readonly PUBLIC_API_HOST: string
+    // 更多环境变量...
+}
+
+interface ImportMeta {
+    readonly env: ImportMetaEnv
+}

package/template/web-app/vue-rsbuild/eslint.config.js

@@ -0,0 +1,109 @@
+import eslint from '@eslint/js'
+import globals from 'globals'
+import tseslint from 'typescript-eslint'
+import importPlugin from 'eslint-plugin-import'
+import pluginVue from 'eslint-plugin-vue'
+
+const scriptExtensions = ['js', 'jsx', 'mjs', 'cjs', 'ts', 'tsx']
+const files = [...scriptExtensions.map(ext => `**/*.${ext}`), '**/*.vue']
+
+export default tseslint.config([
+    { ignores: ['**/node_modules/', 'dist/', '.history/', '.vscode'] },
+    eslint.configs.recommended,
+    importPlugin.flatConfigs.recommended,
+    tseslint.configs.recommended,
+    pluginVue.configs['flat/recommended'],
+    {
+        files,
+        languageOptions: {
+            ecmaVersion: 2018,
+            sourceType: 'module',
+            parserOptions: {
+                ecmaFeatures: {
+                    jsx: true
+                },
+                useJSXTextNode: true
+            },
+            globals: {
+                ...globals.browser,
+                ...globals.node
+            }
+        },
+        settings: {
+            'import/resolver': {
+                typescript: true,
+                node: true
+            }
+        },
+        rules: {
+            'import/export': 'off',
+            'import/namespace': 'off',
+            'import/default': 'off',
+            'import/no-named-as-default-member': 'off',
+            'import/no-named-as-default': 'off',
+            'import/order': [
+                'error',
+                {
+                    groups: [
+                        'builtin',
+                        'external',
+                        'internal',
+                        'parent',
+                        'sibling',
+                        'index',
+                        'object',
+                        'type'
+                    ],
+                    pathGroups: [
+                        { pattern: 'vue', group: 'external', position: 'before' },
+                        { pattern: 'vue-router', group: 'external', position: 'before' }
+                    ],
+                    pathGroupsExcludedImportTypes: ['vue', 'vue-router']
+                }
+            ],
+            'no-case-declarations': 'off',
+            '@typescript-eslint/no-unused-expressions': 'off',
+            '@typescript-eslint/no-empty-object-type': 'off',
+            '@typescript-eslint/no-var-requires': 0,
+            '@typescript-eslint/explicit-function-return-type': 'off',
+            '@typescript-eslint/no-explicit-any': 0,
+            '@typescript-eslint/no-non-null-assertion': 'off',
+            '@typescript-eslint/no-inferrable-types': [
+                'warn',
+                {
+                    ignoreParameters: true
+                }
+            ],
+            '@typescript-eslint/no-unused-vars': [
+                'warn',
+                {
+                    argsIgnorePattern: '^_'
+                }
+            ],
+            '@typescript-eslint/member-delimiter-style': 0,
+            '@typescript-eslint/class-name-casing': 0,
+            '@typescript-eslint/explicit-module-boundary-types': 'off',
+            '@typescript-eslint/ban-ts-comment': 'off',
+            '@typescript-eslint/no-empty-interface': 'off',
+            'vue/multi-word-component-names': 0,
+            'vue/html-indent': ['error', 4],
+            'vue/require-default-prop': 'off',
+            'vue/one-component-per-file': 'off',
+            'vue/html-self-closing': [
+                'error',
+                {
+                    html: {
+                        void: 'always',
+                        normal: 'always',
+                        component: 'always'
+                    },
+                    svg: 'always',
+                    math: 'always'
+                }
+            ],
+            'vue/max-attributes-per-line': 'off',
+            'vue/singleline-html-element-content-newline': 'off',
+            'no-constant-condition': 'off'
+        }
+    }
+])

package/template/web-app/vue-rsbuild/index.html

@@ -0,0 +1,12 @@
+<!doctype html>
+<html lang="en">
+    <head>
+        <meta charset="UTF-8" />
+        <link rel="icon" type="image/svg+xml" href="/vite.svg" />
+        <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    </head>
+    <body>
+        <div id="app"></div>
+        <script type="module" src="/main.ts"></script>
+    </body>
+</html>

package/template/web-app/vue-rsbuild/main.ts

@@ -0,0 +1,7 @@
+import { createPinia } from 'pinia'
+import { VueQueryPlugin } from '@tanstack/vue-query'
+import { router } from '@/router'
+import { app } from '@/domain/app'
+import './style.css'
+
+app.use(VueQueryPlugin).use(createPinia()).use(router).mount('#app')

package/template/web-app/vue-rsbuild/package.json

@@ -0,0 +1,73 @@
+{
+    "name": "vue-vite",
+    "private": true,
+    "version": "0.0.0",
+    "type": "module",
+    "scripts": {
+        "prepare": "husky install",
+        "dev": "rsbuild dev",
+        "build": "rsbuild build",
+        "build:analyse": "rsbuild build --env-mode analyse",
+        "build:rsdoctor": "cross-env RSDOCTOR=true rsbuild build",
+        "preview": "rsbuild preview",
+        "up:rsbuild": "pnpm up @rsbuild/* -L",
+        "format": "prettier --write \"**/*.{vue,ts,js,tsx,jsx,json,css,scss,less}\"",
+        "lint": "vue-tsc --noEmit && eslint --no-error-on-unmatched-pattern && stylelint **/*.{css,scss,less}",
+        "lint:fix": "eslint --fix && stylelint **/*.{css,scss,less} --fix",
+        "cz": "cz",
+        "push": "npm run commit && git push",
+        "commit": "git add . && npm run cz",
+        "up:vite": "pnpm up vite @vitejs/* vite-plugin-* -L"
+    },
+    "dependencies": {
+        "@tanstack/vue-query": "5.51.15",
+        "axios": "1.7.9",
+        "lodash-es": "4.17.21",
+        "pinia": "2.3.1",
+        "vue": "3.5.13",
+        "vue-router": "4.5.0"
+    },
+    "devDependencies": {
+        "@commitlint/cli": "17.6.1",
+        "@commitlint/config-conventional": "17.6.1",
+        "@commitlint/cz-commitlint": "17.5.0",
+        "@eslint/js": "9.15.0",
+        "@rsbuild/core": "1.2.2",
+        "@rsbuild/plugin-eslint": "1.1.0",
+        "@rsbuild/plugin-vue": "1.0.5",
+        "@rsbuild/plugin-styled-components": "1.2.0",
+        "@rsbuild/plugin-svgr": "1.0.6",
+        "@rsbuild/plugin-type-check": "1.2.1",
+        "@rsdoctor/rspack-plugin": "0.4.13",
+        "@faker-js/faker": "8.4.1",
+        "@types/lodash-es": "4.17.12",
+        "@types/mockjs": "1.0.10",
+        "autoprefixer": "10.4.14",
+        "commitizen": "4.3.0",
+        "cssnano": "6.0.0",
+        "eslint": "9.17.0",
+        "eslint-import-resolver-typescript": "3.7.0",
+        "eslint-plugin-import": "2.31.0",
+        "eslint-plugin-vue": "9.32.0",
+        "globals": "15.12.0",
+        "husky": "9.1.6",
+        "inquirer": "8.1.2",
+        "postcss": "8.4.38",
+        "postcss-import": "16.1.0",
+        "postcss-nesting": "12.1.1",
+        "prettier": "3.2.5",
+        "rollup-plugin-visualizer": "5.12.0",
+        "stylelint": "16.10.0",
+        "stylelint-config-standard-scss": "13.1.0",
+        "stylelint-webpack-plugin": "5.0.0",
+        "tailwindcss": "3.4.3",
+        "typescript": "5.7.2",
+        "typescript-eslint": "8.15.0",
+        "vue-tsc": "2.2.0"
+    },
+    "config": {
+        "commitizen": {
+            "path": "@commitlint/cz-commitlint"
+        }
+    }
+}

package/template/web-app/vue-rsbuild/pages/home/index.ts

@@ -0,0 +1 @@
+export { default } from './view.vue'

package/template/web-app/vue-rsbuild/pages/home/view.vue

@@ -0,0 +1,16 @@
+<script setup lang="ts">
+import { watch } from 'vue'
+import { useHomeQuery } from '@/shared/service'
+
+const { data } = useHomeQuery()
+
+watch(data, data => {
+    console.log('data', data?.data)
+})
+</script>
+
+<template>
+    <div>Home</div>
+</template>
+
+<style scoped></style>

package/template/web-app/vue-rsbuild/pages/index.ts

@@ -0,0 +1 @@
+export { default } from './index.vue'

package/template/web-app/vue-rsbuild/pages/index.vue

@@ -0,0 +1,3 @@
+<template>
+    <div><router-view /></div>
+</template>

package/template/web-app/vue-rsbuild/pages/not-found.vue

@@ -0,0 +1,3 @@
+<template>
+    <div>404</div>
+</template>

package/template/web-app/vue-rsbuild/postcss.config.cjs

@@ -0,0 +1,9 @@
+module.exports = {
+    plugins: {
+        'postcss-import': {},
+        'tailwindcss/nesting': 'postcss-nesting',
+        tailwindcss: {},
+        autoprefixer: {},
+        ...(process.env.NODE_ENV === 'production' ? { cssnano: {} } : {})
+    }
+}

package/template/web-app/vue-rsbuild/public/vite.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--logos" width="31.88" height="32" preserveAspectRatio="xMidYMid meet" viewBox="0 0 256 257"><defs><linearGradient id="IconifyId1813088fe1fbc01fb466" x1="-.828%" x2="57.636%" y1="7.652%" y2="78.411%"><stop offset="0%" stop-color="#41D1FF"></stop><stop offset="100%" stop-color="#BD34FE"></stop></linearGradient><linearGradient id="IconifyId1813088fe1fbc01fb467" x1="43.376%" x2="50.316%" y1="2.242%" y2="89.03%"><stop offset="0%" stop-color="#FFEA83"></stop><stop offset="8.333%" stop-color="#FFDD35"></stop><stop offset="100%" stop-color="#FFA800"></stop></linearGradient></defs><path fill="url(#IconifyId1813088fe1fbc01fb466)" d="M255.153 37.938L134.897 252.976c-2.483 4.44-8.862 4.466-11.382.048L.875 37.958c-2.746-4.814 1.371-10.646 6.827-9.67l120.385 21.517a6.537 6.537 0 0 0 2.322-.004l117.867-21.483c5.438-.991 9.574 4.796 6.877 9.62Z"></path><path fill="url(#IconifyId1813088fe1fbc01fb467)" d="M185.432.063L96.44 17.501a3.268 3.268 0 0 0-2.634 3.014l-5.474 92.456a3.268 3.268 0 0 0 3.997 3.378l24.777-5.718c2.318-.535 4.413 1.507 3.936 3.838l-7.361 36.047c-.495 2.426 1.782 4.5 4.151 3.78l15.304-4.649c2.372-.72 4.652 1.36 4.15 3.788l-11.698 56.621c-.732 3.542 3.979 5.473 5.943 2.437l1.313-2.028l72.516-144.72c1.215-2.423-.88-5.186-3.54-4.672l-25.505 4.922c-2.396.462-4.435-1.77-3.759-4.114l16.646-57.705c.677-2.35-1.37-4.583-3.769-4.113Z"></path></svg>

package/template/web-app/vue-rsbuild/router/home/index.ts

@@ -0,0 +1,2 @@
+export { default as names } from './names'
+export { default as routes } from './routes'

package/template/web-app/vue-rsbuild/router/home/names.ts

@@ -0,0 +1,3 @@
+export default {
+    home: 'home'
+}

package/template/web-app/vue-rsbuild/router/home/routes.ts

@@ -0,0 +1,8 @@
+import { RouteRecordRaw } from 'vue-router'
+import names from './names'
+
+const routes: RouteRecordRaw[] = [
+    { path: '/home', name: names.home, component: () => import('@/pages/home') }
+]
+
+export default routes

package/template/web-app/vue-rsbuild/router/index.ts

@@ -0,0 +1,26 @@
+import { createRouter, createWebHistory, RouteRecordRaw } from 'vue-router'
+import names from './names'
+import * as homeRouter from './home'
+
+const routes: RouteRecordRaw[] = [
+    {
+        path: '/',
+        component: () => import('@/pages'),
+        redirect: { name: names.home },
+        children: [
+            ...homeRouter.routes,
+            {
+                path: '/404',
+                name: names.notFound,
+                component: () => import('@/pages/not-found.vue')
+            }
+        ]
+    }
+]
+
+export { default as routerNames } from './names'
+
+export const router = createRouter({
+    history: createWebHistory(import.meta.env.PUBLIC_BASE_URL),
+    routes
+})

package/template/web-app/vue-rsbuild/router/names.ts

@@ -0,0 +1,5 @@
+import * as homeRouter from './home'
+export default {
+    ...homeRouter.names,
+    notFound: '404'
+}

package/template/web-app/vue-rsbuild/rsbuild.config.ts

@@ -0,0 +1,74 @@
+import { defineConfig, loadEnv } from '@rsbuild/core'
+import { pluginVue } from '@rsbuild/plugin-vue'
+import { pluginEslint } from '@rsbuild/plugin-eslint'
+import StylelintWebpackPlugin from 'stylelint-webpack-plugin'
+import { pluginTypeCheck } from '@rsbuild/plugin-type-check'
+import { RsdoctorRspackPlugin } from '@rsdoctor/rspack-plugin'
+import { pluginSvgr } from '@rsbuild/plugin-svgr'
+import { createChunks } from './scripts'
+
+export default defineConfig(({ envMode, command }) => {
+    const { parsed: env } = loadEnv()
+    return {
+        html: {
+            template: './index.html',
+            title: 'Vite + Vue + TS'
+        },
+        source: {
+            entry: {
+                index: './main.ts'
+            }
+        },
+        resolve: {
+            alias: {
+                '@': __dirname
+            }
+        },
+        output: {
+            distPath: {
+                root: 'dist'
+            },
+            cleanDistPath: true
+        },
+        tools: {
+            rspack: {
+                plugins: [
+                    new StylelintWebpackPlugin(),
+                    process.env.RSDOCTOR && new RsdoctorRspackPlugin()
+                ]
+            }
+        },
+        plugins: [
+            pluginTypeCheck(),
+            pluginEslint({
+                eslintPluginOptions: {
+                    configType: 'flat'
+                }
+            }),
+            pluginSvgr(),
+            pluginVue()
+        ],
+        performance: {
+            removeConsole: command === 'build' ? ['log'] : false,
+            chunkSplit: {
+                strategy: 'custom',
+                splitChunks: {
+                    minChunks: 1,
+                    cacheGroups: createChunks([{ libs: ['vue', 'vue-router'], name: 'vue' }])
+                }
+            },
+            bundleAnalyze: envMode === 'analyse' ? { openAnalyzer: true } : void 0
+        },
+        server: {
+            base: env.PUBLIC_BASE_URL,
+            host: '0.0.0.0',
+            compress: false,
+            proxy: [
+                {
+                    context: [env.PUBLIC_API_HOST],
+                    target: 'http://127.0.0.1:3000'
+                }
+            ]
+        }
+    }
+})

package/template/web-app/vue-rsbuild/scripts/createChunks.ts

@@ -0,0 +1,26 @@
+import { CacheGroups } from '@rsbuild/core'
+
+export function createChunks(
+    chunks: Array<{ name: string; libs: string[] | RegExp; priority?: number }>
+) {
+    const result: CacheGroups = {
+        vendors: {
+            test: /[\\/]node_modules[\\/]/,
+            chunks: 'all',
+            name: 'vendors',
+            priority: -1
+        }
+    }
+    chunks.forEach(({ name, libs, priority }) => {
+        result[name] = {
+            test: Array.isArray(libs)
+                ? new RegExp(`[\\\\/]node_modules[\\\\/](${libs.join('|')})[\\\\/]`)
+                : libs,
+            chunks: 'all',
+            name,
+            priority
+        }
+        return result
+    })
+    return result
+}

package/template/web-app/vue-rsbuild/scripts/index.ts

@@ -0,0 +1 @@
+export * from './createChunks'

package/template/web-app/vue-rsbuild/shared/assets/vue.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--logos" width="37.07" height="36" preserveAspectRatio="xMidYMid meet" viewBox="0 0 256 198"><path fill="#41B883" d="M204.8 0H256L128 220.8L0 0h97.92L128 51.2L157.44 0h47.36Z"></path><path fill="#41B883" d="m0 0l128 220.8L256 0h-51.2L128 132.48L50.56 0H0Z"></path><path fill="#35495E" d="M50.56 0L128 133.12L204.8 0h-47.36L128 51.2L97.92 0H50.56Z"></path></svg>

package/template/web-app/vue-rsbuild/shared/hooks/index.ts

@@ -0,0 +1,2 @@
+export { default as useVisible } from './useVisible'
+export { default as useList } from './useList'

package/template/web-app/vue-rsbuild/shared/hooks/useList.ts

@@ -0,0 +1,104 @@
+import { ref, reactive, computed, unref } from 'vue'
+import { cloneDeep, concat, assign, pick, isNil, size, max } from 'lodash-es'
+
+export interface stateType<ListItem, P> {
+    loading: boolean
+    total: number
+    params: P
+    list: ListItem[]
+    sum: Record<string, any>
+    selected: ListItem[]
+    selectedKeys: (string | number)[]
+    pagination: {
+        current: number
+        pageSize: number
+        total: number
+    }
+    selectedLen: number
+}
+export interface createListStorePropsType<ListItem, P> {
+    /**
+     * @description 默认请求参数
+     */
+    defaultParams: P
+    /** 列表请求 */
+    fetch: (
+        state: Pick<stateType<ListItem, P>, 'pagination' | 'selected' | 'total' | 'params'>
+    ) => Promise<{
+        list: any[]
+        page?: number
+        pageSize?: number
+        total?: number
+        sum?: Record<string, any>
+    }>
+    /** 初始化列表时的配置 */
+    initConfig?: {
+        /** 初始化的时候需要保留值的字段 */
+        keepParamsKeys?: Array<keyof P>
+    }
+}
+
+export default function createListStore<
+    ListItem extends Record<string, any>,
+    P extends { page?: number; pageSize?: number; [key: string]: any }
+>(config: createListStorePropsType<ListItem, P>) {
+    const loading = ref<stateType<ListItem, P>['loading']>(true)
+    const total = ref<stateType<ListItem, P>['total']>(0)
+    const params = reactive<stateType<ListItem, P>['params']>(cloneDeep(config.defaultParams))
+    const list = ref<stateType<ListItem, P>['list']>([])
+    const sum = reactive<stateType<ListItem, P>['sum']>({})
+    const selected = ref<stateType<ListItem, P>['selected']>([])
+    const selectedKeys = ref<stateType<ListItem, P>['selectedKeys']>([])
+    const pagination = computed<stateType<ListItem, P>['pagination']>(() => ({
+        current: params.page || 0,
+        pageSize: params.pageSize || 0,
+        total: total.value
+    }))
+    const selectedLen = computed<stateType<ListItem, P>['selectedLen']>(() => {
+        return max([size(selected.value), size(selectedKeys.value)]) || 0
+    })
+    function resetParams() {
+        assign(params, cloneDeep(config.defaultParams))
+    }
+    async function fetchList(arg?: { params?: Partial<P>; isConcat?: boolean; isInit?: boolean }) {
+        loading.value = true
+        try {
+            if (arg?.isInit) {
+                assign(
+                    params,
+                    cloneDeep(config.defaultParams),
+                    pick(params, config?.initConfig?.keepParamsKeys || [])
+                )
+            }
+            assign(params, arg?.params)
+            const result = await config.fetch({
+                pagination: unref(pagination),
+                selected: unref(selected) as ListItem[],
+                total: unref(total),
+                params: params as P
+            })
+            list.value =
+                !isNil(result.page) && arg?.isConcat ? concat(list.value, result.list) : result.list
+            sum.value = result.sum || {}
+            total.value = result.total || total.value
+            params.page = result.page || params.page
+            params.pageSize = result.pageSize || params.pageSize
+        } finally {
+            loading.value = false
+        }
+    }
+
+    return {
+        loading,
+        total,
+        params,
+        list,
+        sum,
+        selected,
+        selectedKeys,
+        pagination,
+        selectedLen,
+        resetParams,
+        fetchList
+    }
+}

package/template/web-app/vue-rsbuild/shared/hooks/useVisible.ts

@@ -0,0 +1,27 @@
+import { ref } from 'vue'
+import { isFunction } from 'lodash-es'
+
+export interface useVisibleConfigType {
+    defaultVisible?: boolean
+    onBeforeShow?: () => Promise<boolean | void>
+    onBeforeHide?: () => Promise<boolean | void>
+}
+export default function useVisible(config?: useVisibleConfigType) {
+    const visible = ref(config?.defaultVisible ?? false)
+    const onShow = async () => {
+        let isShow: boolean | void = true
+        if (isFunction(config?.onBeforeShow)) {
+            isShow = await config?.onBeforeShow?.()
+        }
+        visible.value = isShow !== false
+    }
+    const onClose = async () => {
+        let isHide: boolean | void = true
+        if (isFunction(config?.onBeforeHide)) {
+            isHide = await config?.onBeforeHide?.()
+        }
+        visible.value = isHide === false
+    }
+
+    return { visible, onShow, onClose }
+}

package/template/web-app/vue-rsbuild/shared/service/api.ts

@@ -0,0 +1 @@
+export const HOME_DATA = '/homeData'

package/template/web-app/vue-rsbuild/shared/service/home.ts

@@ -0,0 +1,10 @@
+import { useQuery } from '@tanstack/vue-query'
+import { request } from './request'
+import { HOME_DATA } from './api'
+
+export function useHomeQuery() {
+    return useQuery({
+        queryKey: ['home_data'],
+        queryFn: () => request.post(HOME_DATA)
+    })
+}

package/template/web-app/vue-rsbuild/shared/service/index.ts

@@ -0,0 +1,3 @@
+export * from './request'
+export * as API from './api'
+export * from './home'

package/template/web-app/vue-rsbuild/shared/service/request.ts

@@ -0,0 +1,5 @@
+import axios from 'axios'
+
+export const request = axios.create({
+    baseURL: import.meta.env.PUBLIC_BASE_URL + import.meta.env.PUBLIC_API_HOST
+})

package/template/web-app/vue-rsbuild/style.css

@@ -0,0 +1,3 @@
+@tailwind base;
+@tailwind components;
+@tailwind utilities;

package/template/web-app/vue-rsbuild/tailwind.config.cjs

@@ -0,0 +1,18 @@
+/** @type {import('tailwindcss').Config} */
+module.exports = {
+    content: [
+        './index.html',
+        './app.vue',
+        './main.ts',
+        './pages/**/*.{vue,ts,tsx,js,jsx}',
+        './domain/**/*.{vue,ts,tsx,js,jsx}',
+        './shared/**/*.{vue,ts,tsx,js,jsx}'
+    ],
+    theme: {
+        extend: {}
+    },
+    plugins: [],
+    corePlugins: {
+        preflight: false
+    }
+}

package/template/web-app/vue-rsbuild/tsconfig.json

@@ -0,0 +1,24 @@
+{
+    "compilerOptions": {
+        "baseUrl": ".",
+        "target": "ESNext",
+        "useDefineForClassFields": true,
+        "module": "ESNext",
+        "moduleResolution": "Node",
+        "strict": true,
+        "jsx": "preserve",
+        "sourceMap": true,
+        "resolveJsonModule": true,
+        "isolatedModules": true,
+        "strictPropertyInitialization": false,
+        "esModuleInterop": true,
+        "lib": ["ESNext", "DOM"],
+        "skipLibCheck": true,
+        "paths": {
+            "@/*": ["./*"]
+        }
+    },
+    "include": ["**/*.tsx", "**/*.ts", "**/*.vue"],
+    "exclude": ["scripts", "rsbuild.config.ts"],
+    "references": [{ "path": "./tsconfig.node.json" }]
+}

package/template/web-app/vue-rsbuild/tsconfig.node.json

@@ -0,0 +1,10 @@
+{
+    "compilerOptions": {
+        "composite": true,
+        "module": "ESNext",
+        "moduleResolution": "Node",
+        "allowSyntheticDefaultImports": true,
+        "resolveJsonModule": true
+    },
+    "include": ["scripts", "vite.config.ts", "package.json"]
+}