create-packer 1.26.4 → 1.28.0

package/template/web-app/react-webpack/domain/app/index.ts

@@ -1,2 +1,2 @@
-export * from './app.model'
-export * from './components'
+export * from './app.model'
+export * from './components'

package/template/web-app/react-webpack/{router → domain/router}/home/ids.ts

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

package/template/web-app/react-webpack/{router → domain/router}/home/index.ts

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

package/template/web-app/{react → react-webpack/domain}/router/home/routes.tsx

@@ -1,13 +1,13 @@
-import { lazy } from 'react'
-import ids from './ids'
-import type { routeType } from '../router.types'
-
-const routes: routeType[] = [
-    {
-        path: 'home',
-        id: ids.home,
-        Component: lazy(() => import('@/pages/home'))
-    }
-]
-
-export default routes
+import { lazy } from 'react'
+import ids from './ids'
+import type { routeType } from '../router.types'
+
+const routes: routeType[] = [
+    {
+        path: 'home',
+        id: ids.home,
+        Component: lazy(() => import('@/pages/home'))
+    }
+]
+
+export default routes

package/template/web-app/{react → react-webpack/domain}/router/ids.ts

@@ -1,6 +1,6 @@
-import * as home from './home'
-export default {
-    root: 'root',
-    notFound: 'notFound',
-    ...home.ids
-}
+import * as home from './home'
+export default {
+    root: 'root',
+    notFound: 'notFound',
+    ...home.ids
+}

package/template/web-app/react-webpack/{router → domain/router}/index.ts

@@ -1,4 +1,3 @@
-export { default as routerIds } from './ids'
-export * from './router'
-export * from './router.tool'
-export * from './router.controller'
+export { default as routerIds } from './ids'
+export * from './router'
+export * from './router.types'

package/template/web-app/react-webpack/domain/router/router.tsx

@@ -0,0 +1,28 @@
+import { lazy } from 'react'
+import { createBrowserRouter } from 'react-router-dom'
+import { defineRouter, routeType } from '@/shared/hooks'
+import ids from './ids'
+import * as home from './home'
+
+const routes: routeType[] = [
+    {
+        path: '/',
+        id: ids.root,
+        Component: lazy(() => import('@/pages')),
+        children: [
+            ...home.routes,
+            {
+                path: '*',
+                id: ids.notFound,
+                Component: lazy(() => import('@/pages/not-found'))
+            }
+        ]
+    }
+]
+
+export const routerInstance = createBrowserRouter(routes as never, {
+    basename: ENV_BASE_URL
+})
+
+export const { useMatchRoutes, useQuery, useRouter, useRoutePermission } =
+    defineRouter(routerInstance)

package/template/web-app/react-webpack/domain/router/router.types.ts

@@ -0,0 +1,3 @@
+import { routeType as $routeType } from '@/shared/hooks'
+
+export type routeType = $routeType

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

@@ -1,17 +1,17 @@
-declare const ENV_BASE_URL: string
-declare const ENV_API_HOST: string
-
-declare module '*.css'
-declare module '*.less'
-declare module '*.scss'
-declare module '*.png'
-declare module '*.webp'
-declare module '*.svg?url' {
-    const url: string
-    export default url
-}
-declare module '*.svg' {
-    import * as React from 'react'
-    function ReactComponent(props: React.SVGProps<SVGSVGElement>): React.ReactElement
-    export default ReactComponent
-}
+declare const ENV_BASE_URL: string
+declare const ENV_API_HOST: string
+
+declare module '*.css'
+declare module '*.less'
+declare module '*.scss'
+declare module '*.png'
+declare module '*.webp'
+declare module '*.svg?url' {
+    const url: string
+    export default url
+}
+declare module '*.svg' {
+    import * as React from 'react'
+    function ReactComponent(props: React.SVGProps<SVGSVGElement>): React.ReactElement
+    export default ReactComponent
+}

package/template/web-app/react-webpack/index.css

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

package/template/web-app/react-webpack/index.html

@@ -1,12 +1,12 @@
-<!DOCTYPE html>
-<html lang="en">
-    <head>
-        <meta charset="UTF-8" />
-        <link rel="icon" type="image/svg+xml" href="/react.svg" />
-        <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-        <title>webpack5 + React + TS</title>
-    </head>
-    <body>
-        <div id="root"></div>
-    </body>
-</html>
+<!DOCTYPE html>
+<html lang="en">
+    <head>
+        <meta charset="UTF-8" />
+        <link rel="icon" type="image/svg+xml" href="/react.svg" />
+        <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+        <title>webpack5 + React + TS</title>
+    </head>
+    <body>
+        <div id="root"></div>
+    </body>
+</html>

package/template/web-app/react-webpack/main.tsx

@@ -1,11 +1,5 @@
-import { createRoot } from 'react-dom/client'
-import { RouterProvider } from 'react-router-dom'
-import { App } from '@/domain/app'
-import { router } from '@/router'
-import './index.css'
-
-createRoot(document.getElementById('root') as HTMLElement).render(
-    <App>
-        <RouterProvider router={router} />
-    </App>
-)
+import { createRoot } from 'react-dom/client'
+import { App } from '@/domain/app'
+import './index.css'
+
+createRoot(document.getElementById('root') as HTMLElement).render(<App />)

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

@@ -1,89 +1,86 @@
-{
-    "name": "react-app-webpack",
-    "version": "1.0.0",
-    "main": "./dist/index",
-    "module": "./dist/index.esm.js",
-    "private": true,
-    "author": "1K",
-    "scripts": {
-        "prepare": "husky install",
-        "dev": "webpack serve --env mode=dev",
-        "build": "webpack --env mode=prod",
-        "build:analyzer": "webpack --env mode=analyzer",
-        "up:vite": "pnpm up vite @vitejs/* -L",
-        "format": "prettier --write \"**/*.{ts,js,tsx,jsx,json,css,scss,less}\"",
-        "lint": "tsc --noEmit && eslint **/*.{tsx,ts,jsx,js} --no-error-on-unmatched-pattern && stylelint **/*.{css,scss,less}",
-        "lint:fix": "eslint **/*.{tsx,ts,jsx,js} --fix && stylelint **/*.{css,scss,less} --fix",
-        "cz": "cz",
-        "push": "npm run commit && git push",
-        "commit": "git add . && npm run cz"
-    },
-    "dependencies": {
-        "1k-types": "1.1.2",
-        "axios": "1.5.0",
-        "define-zustand": "3.1.0",
-        "immer": "10.0.2",
-        "lodash-es": "4.17.21",
-        "qs": "6.11.2",
-        "react": "18.2.0",
-        "react-dom": "18.2.0",
-        "react-router-dom": "6.14.0",
-        "react-use": "17.4.0",
-        "tailwindcss": "3.3.3",
-        "zustand": "4.4.1"
-    },
-    "devDependencies": {
-        "@commitlint/cli": "17.7.1",
-        "@commitlint/config-conventional": "17.7.0",
-        "@commitlint/cz-commitlint": "17.7.1",
-        "@svgr/webpack": "8.1.0",
-        "@types/lodash-es": "4.17.8",
-        "@types/qs": "6.9.7",
-        "@types/react": "18.2.21",
-        "@types/react-dom": "18.2.7",
-        "@types/react-redux": "7.1.26",
-        "@types/react-router-config": "5.0.7",
-        "@types/react-router-dom": "5.3.3",
-        "@typescript-eslint/eslint-plugin": "6.17.0",
-        "@typescript-eslint/parser": "6.17.0",
-        "autoprefixer": "10.4.15",
-        "commitizen": "4.3.0",
-        "css-loader": "6.8.1",
-        "cssnano": "6.0.1",
-        "dotenv": "16.3.1",
-        "esbuild-loader": "4.0.1",
-        "eslint": "8.48.0",
-        "eslint-import-resolver-typescript": "3.5.5",
-        "eslint-plugin-import": "2.27.5",
-        "eslint-plugin-prettier": "5.0.0",
-        "eslint-plugin-react": "7.32.2",
-        "eslint-plugin-react-hooks": "4.6.0",
-        "eslint-webpack-plugin": "4.0.1",
-        "fork-ts-checker-webpack-plugin": "8.0.0",
-        "html-webpack-plugin": "5.5.3",
-        "husky": "8.0.3",
-        "mini-css-extract-plugin": "2.7.6",
-        "postcss-import": "15.1.0",
-        "postcss-loader": "7.3.3",
-        "postcss-nesting": "12.0.1",
-        "prettier": "3.0.2",
-        "react-css-modules": "4.7.11",
-        "react-test-renderer": "18.2.0",
-        "rimraf": "5.0.1",
-        "style-loader": "3.3.3",
-        "stylelint": "15.10.3",
-        "stylelint-config-standard": "34.0.0",
-        "stylelint-webpack-plugin": "4.1.1",
-        "typescript": "5.3.3",
-        "webpack": "5.88.2",
-        "webpack-bundle-analyzer": "4.9.1",
-        "webpack-cli": "5.1.4",
-        "webpack-dev-server": "4.15.1",
-        "webpackbar": "5.0.2"
-    },
-    "config": {
-        "commitizen": {
-            "path": "@commitlint/cz-commitlint"
-        }
-    }
-}
+{
+    "name": "react-app-webpack",
+    "version": "1.0.0",
+    "main": "./dist/index",
+    "module": "./dist/index.esm.js",
+    "private": true,
+    "author": "1K",
+    "scripts": {
+        "prepare": "husky install",
+        "dev": "webpack serve --env mode=dev",
+        "build": "webpack --env mode=prod",
+        "build:analyzer": "webpack --env mode=analyzer",
+        "up:webpack": "pnpm up webpackbar webpackbar-* -L",
+        "format": "prettier --write \"**/*.{ts,js,tsx,jsx,json,css,scss,less}\"",
+        "lint": "tsc --noEmit && eslint **/*.{tsx,ts,jsx,js} --no-error-on-unmatched-pattern && stylelint **/*.{css,scss,less}",
+        "lint:fix": "eslint **/*.{tsx,ts,jsx,js} --fix && stylelint **/*.{css,scss,less} --fix",
+        "cz": "cz",
+        "push": "npm run commit && git push",
+        "commit": "git add . && npm run cz"
+    },
+    "dependencies": {
+        "1k-types": "1.1.2",
+        "axios": "1.6.7",
+        "define-zustand": "3.1.0",
+        "immer": "10.0.3",
+        "lodash-es": "4.17.21",
+        "qs": "6.11.2",
+        "react": "18.2.0",
+        "react-dom": "18.2.0",
+        "react-router-dom": "6.14.0",
+        "react-use": "17.5.0",
+        "tailwindcss": "3.4.1",
+        "zustand": "4.5.1"
+    },
+    "devDependencies": {
+        "@commitlint/cli": "18.6.1",
+        "@commitlint/config-conventional": "18.6.2",
+        "@commitlint/cz-commitlint": "18.6.1",
+        "@svgr/webpack": "8.1.0",
+        "@types/lodash-es": "4.17.12",
+        "@types/qs": "6.9.11",
+        "@types/react": "18.0.38",
+        "@types/react-dom": "18.0.11",
+        "@typescript-eslint/eslint-plugin": "7.0.2",
+        "@typescript-eslint/parser": "7.0.2",
+        "autoprefixer": "10.4.17",
+        "commitizen": "4.3.0",
+        "css-loader": "6.10.0",
+        "cssnano": "6.0.3",
+        "dotenv": "16.4.5",
+        "esbuild-loader": "3",
+        "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-react": "7.33.2",
+        "eslint-plugin-react-hooks": "4.6.0",
+        "eslint-webpack-plugin": "4.0.1",
+        "fork-ts-checker-webpack-plugin": "9.0.2",
+        "html-webpack-plugin": "5.6.0",
+        "husky": "9.0.11",
+        "mini-css-extract-plugin": "2.8.0",
+        "postcss-import": "16.0.1",
+        "postcss-loader": "8.1.0",
+        "postcss-nesting": "12.0.3",
+        "prettier": "3.2.5",
+        "react-css-modules": "4.7.11",
+        "react-test-renderer": "18.2.0",
+        "rimraf": "5.0.5",
+        "style-loader": "3.3.4",
+        "stylelint": "16.2.1",
+        "stylelint-config-standard-scss": "13.0.0",
+        "stylelint-webpack-plugin": "5.0.0",
+        "typescript": "5.3.3",
+        "webpack": "5.91.0",
+        "webpack-bundle-analyzer": "4.10.1",
+        "webpack-cli": "5.1.4",
+        "webpack-dev-server": "5.0.4",
+        "webpackbar": "6.0.1"
+    },
+    "config": {
+        "commitizen": {
+            "path": "@commitlint/cz-commitlint"
+        }
+    }
+}

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

@@ -1,6 +1,6 @@
-import styles from './home.module.css'
-
-export default function Home() {
-    console.log('1', 1)
-    return <div className={styles.root}>sdsddds</div>
-}
+import styles from './home.module.css'
+
+export default function Home() {
+    console.log('1', 1)
+    return <div className={styles.root}>sdsddds</div>
+}

package/template/web-app/react-webpack/pages/home/index.ts

@@ -1 +1 @@
-export { default } from './home'
+export { default } from './home'

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

@@ -1,21 +1,22 @@
-import { Suspense, useEffect } from 'react'
-import { Outlet, useLocation } from 'react-router-dom'
-import { navigate, routerIds } from '@/router'
-
-const View = () => {
-    const location = useLocation()
-
-    useEffect(() => {
-        if (location.pathname === '/') {
-            navigate({ id: routerIds.home })
-        }
-    }, [location])
-
-    return (
-        <Suspense fallback={<>loading...</>}>
-            <Outlet />
-        </Suspense>
-    )
-}
-
-export default View
+import { Suspense, useEffect } from 'react'
+import { Outlet, useLocation } from 'react-router-dom'
+import { useRouter, routerIds } from '@/domain/router'
+
+const View = () => {
+    const location = useLocation()
+    const navigate = useRouter(state => state.navigate)
+
+    useEffect(() => {
+        if (location.pathname === '/') {
+            navigate({ id: routerIds.home })
+        }
+    }, [location])
+
+    return (
+        <Suspense fallback={<>loading...</>}>
+            <Outlet />
+        </Suspense>
+    )
+}
+
+export default View

package/template/web-app/react-webpack/pages/not-found.tsx

@@ -1,3 +1,3 @@
-export default function AppNotFound() {
-    return <div>404</div>
-}
+export default function AppNotFound() {
+    return <div>404</div>
+}

package/template/web-app/react-webpack/postcss.config.js

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

package/template/web-app/react-webpack/shared/hooks/defineRouter/defineRouter.types.ts

@@ -0,0 +1,30 @@
+import { FunctionComponent, ReactNode } from 'react'
+import { RouteObject } from 'react-router-dom'
+
+export type routeType = Omit<RouteObject, 'children' | 'id'> & {
+    id: string
+    meta?: {
+        title?: string
+        /** 只在当前路由才显示的小提示 */
+        tip?: string
+    }
+    unauthorized?: boolean
+    query?: () => Record<string, any>
+    menu?: {
+        hidden?: boolean
+        icon?: FunctionComponent
+        label?: ReactNode
+    }
+    children?: routeType[]
+}
+
+export type editableRouteType = Omit<routeType, 'element' | 'errorElement' | 'children'>
+
+export interface routerFactoryArgType {
+    basename: string
+    routes: routeType[]
+}
+
+export type routeByIdType = Omit<routeType, 'children'> & {
+    pos: string
+}