@aoao-y33/hooks 0.0.1

package/package.json

@@ -0,0 +1,28 @@
+{
+  "name": "@aoao-y33/hooks",
+  "version": "0.0.1",
+  "private": false,
+  "description": "vue-hook包",
+  "main": "index.js",
+  "module": "./dist/index.js",
+  "types": "./dist/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.js"
+    }
+  },
+  "scripts": {
+    "build": "vite build",
+    "add": "pnpm install",
+    "publish": "npm publish --access public"
+  },
+  "keywords": [],
+  "author": "",
+  "license": "ISC",
+  "packageManager": "pnpm@10.32.1",
+  "dependencies": {
+    "@aoaoy33/utils": "workspace:*",
+    "lodash": "^4.18.1"
+  }
+}

package/src/core/useState.ts

@@ -0,0 +1,14 @@
+import {mergeDeep} from "@aoaoy33/utils";
+import {type Ref, ref} from "vue";
+
+export function useState<T>(initValue: T) {
+    const state = ref<T>(initValue) as Ref<T>;
+    const setState = (value: Partial<T> | T, write: boolean = false) => {
+        if (write) {
+            state.value = value as T;
+        } else {
+            state.value = mergeDeep(state.value, value);
+        }
+    }
+    return [state, setState] as const;
+}

package/src/index.ts

@@ -0,0 +1 @@
+export * from './core/useState';

package/test/core.test.ts

@@ -0,0 +1,91 @@
+import {useState} from "@/core/useState";
+import {describe, expect} from "vitest";
+import {mount} from '@vue/test-utils';
+import {defineComponent, nextTick} from "vue";
+
+describe('useState 测试', () => {
+    it('基本数据显示 ', () => {
+        const vueWrapper = mount(defineComponent({
+            setup() {
+                const [state] = useState(1);
+                return {state};
+            },
+            template: '<div></div>'
+        }));
+        expect(vueWrapper.vm.state).toEqual(1);
+    });
+
+    it('数组数据显示', () => {
+        const vueWrapper = mount(defineComponent({
+            setup() {
+                const [state] = useState([2, 4, 5]);
+                return {state};
+            },
+            template: '<div></div>'
+        }));
+        expect(vueWrapper.vm.state).toEqual([2, 4, 5]);
+    });
+
+    it("对象数据显示", () => {
+        const vueWrapper = mount(defineComponent({
+            setup() {
+                const [state] = useState({name: "ax-y33"});
+                return {state};
+            },
+            template: '<div></div>'
+        }))
+        expect(vueWrapper.vm.state).toEqual({name: "ax-y33"});
+    })
+
+    it('setState 默认合并对象数据', async () => {
+        const vueWrapper = mount(defineComponent({
+            setup() {
+                // 初始状态包含 name 和 version
+                const [state, setState] = useState({ name: "ax-y33", version: "1.0.0" })
+                return { state, setState }
+            },
+            template: '<div></div>'
+        }))
+
+        const { state, setState } = vueWrapper.vm
+
+        // 仅传入部分属性进行合并
+        setState({ version: "2.0.0" })
+        await nextTick() // 等待响应式更新
+
+        // 期望 name 保留，version 被更新
+        expect(state).toEqual({ name: "ax-y33", version: "2.0.0" })
+    })
+
+    it('setState 使用 write=true 完全替换数据', async () => {
+        const vueWrapper = mount(defineComponent({
+            setup() {
+                const [state, setState] = useState({ name: "ax-y33", version: "1.0.0" })
+                // 传入第二个参数 true，期望完全替换
+                setState({ name: "new-app" }, true)
+                return { state, setState }
+            },
+            template: '<div></div>'
+        }))
+        // 期望旧的 version 属性消失，被新对象完全覆盖
+        expect(vueWrapper.vm.state).toEqual({ name: "new-app" })
+    })
+
+    it('setState 修改基本类型数据', async () => {
+        const vueWrapper = mount(defineComponent({
+            setup() {
+                const [state, setState] = useState(100)
+                return { state, setState }
+            },
+            template: '<div></div>'
+        }))
+
+        const { state, setState } = vueWrapper.vm
+
+        // 对于基本类型，write 参数通常影响不大（因为无法合并），主要测试赋值
+        setState(200)
+        await nextTick()
+
+        expect(state).toBe(200)
+    })
+})

package/tsconfig.json

@@ -0,0 +1,29 @@
+{
+  "extends": "@vue/tsconfig/tsconfig.dom.json",
+  "compilerOptions": {
+    "tsBuildInfoFile": "./node_modules/.tmp/tsconfig.app.tsbuildinfo",
+    "types": [
+      "vite/client",
+      "vitest/globals"
+    ],
+    "declaration": true,
+    "declarationMap": true,
+    "emitDeclarationOnly": false,
+    "rootDir": "./src",
+    /* Linting */
+    "noUnusedLocals": true,
+    "noUnusedParameters": true,
+    "erasableSyntaxOnly": true,
+    "noFallthroughCasesInSwitch": true,
+    "baseUrl": ".",
+    "paths": {
+      "@/*": [
+        "src/*"
+      ]
+    }
+  },
+  "include": [
+    "src/**/*.ts",
+    "test/**/*.ts"
+  ]
+}

package/vite.config.ts

@@ -0,0 +1,40 @@
+import {defineConfig} from "vitest/config";
+import vue from '@vitejs/plugin-vue'
+import {resolve} from 'path'
+import dts from "vite-plugin-dts"
+
+export default defineConfig({
+    plugins: [vue(),
+        dts({
+            tsconfigPath: "./tsconfig.json",
+            outDirs: "dist",
+            exclude: ["src/test"]
+        })
+    ],
+    build: {
+        lib: {
+            entry: resolve(__dirname, 'src/index.ts'),
+            formats: ['es'],
+            fileName: () => `index.js`
+        },
+        rollupOptions: {
+            external: ['vue'],
+            output: {
+                globals: {
+                    vue: 'Vue'
+                },
+            },
+        },
+        outDir: 'dist',
+        sourcemap: false
+    },
+    resolve: {
+        alias: {
+            '@': resolve(__dirname, 'src')
+        }
+    },
+    test: {
+        globals: true,
+        environment: 'jsdom',
+    }
+})