create-packer 1.32.0 → 1.32.2

package/package.json

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

package/template/web-app/react/README.md

@@ -7,7 +7,7 @@
 -   Typescript
 -   react-router
 -   Zustand
--   Tailwindcss
+-   styled-components
 -   Eslint
 -   Prettier
 -   axios

package/template/web-app/react/domain/app/components/app-context.tsx

@@ -1,14 +1,17 @@
-import { FunctionComponent, StrictMode } from 'react'
+import { FunctionComponent } from 'react'
 import { ThemeProvider } from 'styled-components'
+import { QueryClient, QueryClientProvider } from '@tanstack/react-query'
 import { theme } from '@/shared/theme'
 
+const queryClient = new QueryClient()
+
 export interface propsType {
     children: React.ReactNode
 }
 export const Root: FunctionComponent<propsType> = props => {
     return (
-        <StrictMode>
+        <QueryClientProvider client={queryClient}>
             <ThemeProvider theme={theme}>{props.children}</ThemeProvider>
-        </StrictMode>
+        </QueryClientProvider>
     )
 }

package/template/web-app/react/package.json

@@ -19,6 +19,7 @@
     },
     "dependencies": {
         "1k-types": "1.2.0",
+        "@tanstack/react-query": "5.51.15",
         "axios": "1.3.6",
         "define-zustand": "3.1.1",
         "immer": "10.0.1",
@@ -35,6 +36,7 @@
         "@commitlint/cli": "17.6.1",
         "@commitlint/config-conventional": "17.6.1",
         "@commitlint/cz-commitlint": "17.5.0",
+        "@faker-js/faker": "8.4.1",
         "@rollup/plugin-eslint": "9.0.5",
         "@types/lodash-es": "4.17.7",
         "@types/mockjs": "1.0.7",
@@ -56,7 +58,6 @@
         "eslint-plugin-react-hooks": "4.6.0",
         "husky": "8.0.3",
         "inquirer": "^8.1.2",
-        "mockjs": "1.1.0",
         "postcss": "8.4.35",
         "postcss-import": "16.0.1",
         "postcss-nesting": "12.0.3",

package/template/web-app/react/pages/home/home.mock.ts

@@ -1,16 +1,19 @@
-import Mock from 'mockjs'
+import { faker } from '@faker-js/faker'
 import { defineMock } from '@/mockUtils'
 import { API } from '@/shared/service'
+
 export default defineMock([
     {
         url: API.HOME_DATA,
-        body: Mock.mock({
-            'data|10': [
-                {
-                    name: '@string',
-                    age: '@natural'
-                }
-            ]
-        })
+        body: faker.helpers.multiple(
+            () => ({
+                id: faker.string.uuid(),
+                name: faker.person.fullName(),
+                age: faker.number.int({ max: 110 })
+            }),
+            {
+                count: 10
+            }
+        )
     }
 ])

package/template/web-app/react/pages/home/home.tsx

@@ -1,13 +1,10 @@
-import { useEffect } from 'react'
-import { request, API } from '@/shared/service'
+import { useHomeQuery } from '@/shared/service'
 import { StyledRoot } from './home.styled'
 
 export default function Home() {
-    useEffect(() => {
-        request.post(API.HOME_DATA).then(({ data }) => {
-            console.log('data', data)
-        })
-    }, [])
+    const query = useHomeQuery()
+
+    console.log('data', query.data)
 
     return <StyledRoot>sdfs</StyledRoot>
 }

package/template/web-app/react/shared/service/home.ts

@@ -0,0 +1,10 @@
+import { useQuery } from '@tanstack/react-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/react/shared/service/index.ts

@@ -1,2 +1,3 @@
-export { default as request } from './request'
+export * from './request'
 export * as API from './api'
+export * from './home'

package/template/web-app/react/shared/service/request.ts

@@ -1,7 +1,5 @@
 import axios from 'axios'
 
-const request = axios.create({
+export const request = axios.create({
     baseURL: import.meta.env.VITE_BASE_URL + import.meta.env.VITE_API_HOST
 })
-
-export default request

package/template/web-app/react-webpack/domain/app/components/app-context.tsx

@@ -1,14 +1,17 @@
-import { FunctionComponent, StrictMode } from 'react'
+import { FunctionComponent } from 'react'
 import { ThemeProvider } from 'styled-components'
+import { QueryClient, QueryClientProvider } from '@tanstack/react-query'
 import { theme } from '@/shared/theme'
 
+const queryClient = new QueryClient()
+
 export interface propsType {
     children: React.ReactNode
 }
 export const Root: FunctionComponent<propsType> = props => {
     return (
-        <StrictMode>
+        <QueryClientProvider client={queryClient}>
             <ThemeProvider theme={theme}>{props.children}</ThemeProvider>
-        </StrictMode>
+        </QueryClientProvider>
     )
 }

package/template/web-app/react-webpack/global.d.ts

@@ -1,8 +1,10 @@
 import 'styled-components'
 import { themeType } from './shared/theme'
 
-declare const ENV_BASE_URL: string
-declare const ENV_API_HOST: string
+declare global {
+    const ENV_BASE_URL: string
+    const ENV_API_HOST: string
+}
 
 declare module '*.css'
 declare module '*.less'

package/template/web-app/react-webpack/package.json

@@ -20,6 +20,7 @@
     },
     "dependencies": {
         "1k-types": "1.2.0",
+        "@tanstack/react-query": "5.51.15",
         "axios": "1.6.7",
         "define-zustand": "3.1.1",
         "immer": "10.0.3",

package/template/web-app/react-webpack/pages/home/home.tsx

@@ -1,5 +1,10 @@
+import { useHomeQuery } from '@/shared/service'
 import { StyledRoot } from './home.styled'
 
 export default function Home() {
+    const homeQuery = useHomeQuery()
+
+    console.log('data', homeQuery.data?.data)
+
     return <StyledRoot>sdsddds</StyledRoot>
 }

package/template/web-app/react-webpack/shared/service/home.ts

@@ -0,0 +1,8 @@
+import { useQuery } from '@tanstack/react-query'
+
+export function useHomeQuery() {
+    return useQuery({
+        queryKey: ['home_data'],
+        queryFn: () => Promise.resolve({ data: { data: [] } })
+    })
+}

package/template/web-app/react-webpack/shared/service/index.ts

@@ -1 +1,2 @@
-export { default as request } from './request'
+export * from './request'
+export * from './home'

package/template/web-app/react-webpack/shared/service/request.ts

@@ -1,7 +1,5 @@
 import axios from 'axios'
 
-const request = axios.create({
+export const request = axios.create({
     baseURL: ENV_BASE_URL + ENV_API_HOST
 })
-
-export default request

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

@@ -1,6 +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(createPinia()).use(router).mount('#app')
+app.use(VueQueryPlugin).use(createPinia()).use(router).mount('#app')

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

@@ -1,70 +1,71 @@
-{
-    "name": "vue-vite",
-    "private": true,
-    "version": "0.0.0",
-    "type": "module",
-    "scripts": {
-        "prepare": "husky install",
-        "dev": "vite",
-        "build": "vue-tsc --noEmit && vite build",
-        "build:analyse": "tsc --noEmit && vite build --mode analyse",
-        "preview": "vite preview",
-        "format": "prettier --write \"**/*.{ts,js,tsx,jsx,json,vue,css,scss,less}\"",
-        "lint": "vue-tsc --noEmit && eslint **/*.{ts,tsx,js,jsx,vue} --no-error-on-unmatched-pattern && stylelint **/*.{css,scss,less}",
-        "lint:fix": "eslint **/*.{ts,tsx,js,jsx,vue} --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": {
-        "1k-types": "1.2.0",
-        "axios": "1.3.6",
-        "lodash-es": "4.17.21",
-        "pinia": "2.1.7",
-        "vue": "3.4.21",
-        "vue-router": "4.3.0"
-    },
-    "devDependencies": {
-        "@commitlint/cli": "17.6.1",
-        "@commitlint/config-conventional": "17.6.1",
-        "@commitlint/cz-commitlint": "17.5.0",
-        "@rollup/plugin-eslint": "9.0.5",
-        "@types/lodash-es": "4.17.12",
-        "@types/mockjs": "1.0.10",
-        "@typescript-eslint/eslint-plugin": "7.6.0",
-        "@typescript-eslint/parser": "7.6.0",
-        "@vitejs/plugin-vue": "5.0.5",
-        "@vitejs/plugin-vue-jsx": "4.0.0",
-        "autoprefixer": "10.4.14",
-        "commitizen": "4.3.0",
-        "cssnano": "6.0.0",
-        "eslint": "8.56.0",
-        "eslint-import-resolver-typescript": "3.6.1",
-        "eslint-plugin-import": "2.29.1",
-        "eslint-plugin-prettier": "5.1.3",
-        "eslint-plugin-vue": "9.21.1",
-        "husky": "8.0.3",
-        "inquirer": "^8.1.2",
-        "mockjs": "1.1.0",
-        "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.3.1",
-        "stylelint-config-standard-scss": "13.1.0",
-        "tailwindcss": "3.4.3",
-        "typescript": "5.5.2",
-        "vite": "5.3.3",
-        "vite-plugin-mock-dev-server": "1.5.1",
-        "vite-plugin-stylelint": "5.3.1",
-        "vite-svg-loader": "5.1.0",
-        "vue-tsc": "2.0.11"
-    },
-    "config": {
-        "commitizen": {
-            "path": "@commitlint/cz-commitlint"
-        }
-    }
-}
+{
+    "name": "vue-vite",
+    "private": true,
+    "version": "0.0.0",
+    "type": "module",
+    "scripts": {
+        "prepare": "husky install",
+        "dev": "vite",
+        "build": "vue-tsc --noEmit && vite build",
+        "build:analyse": "tsc --noEmit && vite build --mode analyse",
+        "preview": "vite preview",
+        "format": "prettier --write \"**/*.{ts,js,tsx,jsx,json,vue,css,scss,less}\"",
+        "lint": "vue-tsc --noEmit && eslint **/*.{ts,tsx,js,jsx,vue} --no-error-on-unmatched-pattern && stylelint **/*.{css,scss,less}",
+        "lint:fix": "eslint **/*.{ts,tsx,js,jsx,vue} --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": {
+        "1k-types": "1.2.0",
+        "@tanstack/vue-query": "5.51.15",
+        "axios": "1.3.6",
+        "lodash-es": "4.17.21",
+        "pinia": "2.1.7",
+        "vue": "3.4.21",
+        "vue-router": "4.3.0"
+    },
+    "devDependencies": {
+        "@commitlint/cli": "17.6.1",
+        "@commitlint/config-conventional": "17.6.1",
+        "@commitlint/cz-commitlint": "17.5.0",
+        "@faker-js/faker": "8.4.1",
+        "@rollup/plugin-eslint": "9.0.5",
+        "@types/lodash-es": "4.17.12",
+        "@types/mockjs": "1.0.10",
+        "@typescript-eslint/eslint-plugin": "7.6.0",
+        "@typescript-eslint/parser": "7.6.0",
+        "@vitejs/plugin-vue": "5.0.5",
+        "@vitejs/plugin-vue-jsx": "4.0.0",
+        "autoprefixer": "10.4.14",
+        "commitizen": "4.3.0",
+        "cssnano": "6.0.0",
+        "eslint": "8.56.0",
+        "eslint-import-resolver-typescript": "3.6.1",
+        "eslint-plugin-import": "2.29.1",
+        "eslint-plugin-prettier": "5.1.3",
+        "eslint-plugin-vue": "9.21.1",
+        "husky": "8.0.3",
+        "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.3.1",
+        "stylelint-config-standard-scss": "13.1.0",
+        "tailwindcss": "3.4.3",
+        "typescript": "5.5.2",
+        "vite": "5.3.3",
+        "vite-plugin-mock-dev-server": "1.5.1",
+        "vite-plugin-stylelint": "5.3.1",
+        "vite-svg-loader": "5.1.0",
+        "vue-tsc": "2.0.11"
+    },
+    "config": {
+        "commitizen": {
+            "path": "@commitlint/cz-commitlint"
+        }
+    }
+}

package/template/web-app/vue/pages/home/home.mock.ts

@@ -1,16 +1,19 @@
-import Mock from 'mockjs'
+import { faker } from '@faker-js/faker'
 import { defineMock } from '@/mockUtils'
 import { API } from '@/shared/service'
+
 export default defineMock([
     {
         url: API.HOME_DATA,
-        body: Mock.mock({
-            'data|10': [
-                {
-                    name: '@string',
-                    age: '@natural'
-                }
-            ]
-        })
+        body: faker.helpers.multiple(
+            () => ({
+                id: faker.string.uuid(),
+                name: faker.person.fullName(),
+                age: faker.number.int({ max: 110 })
+            }),
+            {
+                count: 10
+            }
+        )
     }
 ])

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

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

package/template/web-app/vue/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/shared/service/index.ts

@@ -1,2 +1,3 @@
-export { default as request } from './request'
+export * from './request'
 export * as API from './api'
+export * from './home'

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

@@ -1,7 +1,5 @@
 import axios from 'axios'
 
-const request = axios.create({
+export const request = axios.create({
     baseURL: import.meta.env.VITE_BASE_URL + import.meta.env.VITE_API_HOST
 })
-
-export default request

package/template/web-extension/package.json

@@ -17,6 +17,7 @@
         "commit": "git add . && npm run cz"
     },
     "dependencies": {
+        "@tanstack/react-query": "5.51.15",
         "axios": "^1.7.2",
         "define-zustand": "3.1.1",
         "immer": "10.0.1",

package/template/web-extension/shared/components/app-context.tsx

@@ -1,7 +1,14 @@
 import { FunctionComponent, ReactNode } from 'react'
 import { ThemeProvider } from 'styled-components'
+import { QueryClient, QueryClientProvider } from '@tanstack/react-query'
 import { theme } from 'shared/styles'
 
+const queryClient = new QueryClient()
+
 export const AppContext: FunctionComponent<{ children: ReactNode }> = props => {
-    return <ThemeProvider theme={theme}>{props.children}</ThemeProvider>
+    return (
+        <QueryClientProvider client={queryClient}>
+            <ThemeProvider theme={theme}>{props.children}</ThemeProvider>
+        </QueryClientProvider>
+    )
 }