create-packer 1.10.4 → 1.10.5

package/package.json

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

package/template/react-vite/README.md

@@ -0,0 +1,13 @@
+## Vite + react18 + Typescript
+
+### Features
+- Vite 3.x
+- React 18.x
+- Typescript 4.x
+- react-router 6.x
+- Zustand 4.x
+- Tailwindcss 3.x
+- Jest 28.x
+- Eslint
+- Prettier
+- Alias @ to <project_root>/src

package/template/react-vite/package.json

@@ -22,7 +22,8 @@
     "dependencies": {
         "react": "18.2.0",
         "react-dom": "18.2.0",
-        "react-router-dom": "6.3.0"
+        "react-router-dom": "6.3.0",
+        "zustand": "4.0.0"
     },
     "devDependencies": {
         "@testing-library/dom": "8.14.0",

package/template/react-vite/src/app/app.container.tsx

@@ -0,0 +1,8 @@
+import { PropsWithChildren } from 'react'
+
+export interface AppPropsType {}
+function App({ children }: PropsWithChildren<AppPropsType>) {
+    return <div>{children}</div>
+}
+
+export default App

package/template/react-vite/src/app/app.controller.ts

@@ -0,0 +1,7 @@
+import { useEffect } from 'react'
+
+export function useInit() {
+    useEffect(() => {
+        console.log('init')
+    }, [])
+}

package/template/react-vite/src/app/app.store.ts

@@ -0,0 +1,8 @@
+import create from 'zustand'
+import { combine } from 'zustand/middleware'
+
+export default create(
+    combine({}, setState => {
+        return {}
+    })
+)

package/template/react-vite/src/app/index.ts

@@ -0,0 +1,3 @@
+export { default } from './app.container'
+export { default as useAppStore } from './app.store'
+export * from './app.controller'

package/template/react-vite/src/main.tsx

@@ -1,20 +1,16 @@
 import React from 'react'
 import ReactDOM from 'react-dom/client'
-import { BrowserRouter, Routes, Route } from 'react-router-dom'
-import Layout from './Layout'
-import routes from './routes'
+import { BrowserRouter } from 'react-router-dom'
+import App from './app'
+import Route from './router'
 import './index.css'
 
 ReactDOM.createRoot(document.getElementById('root') as HTMLElement).render(
     <React.StrictMode>
         <BrowserRouter>
-            <Layout>
-                <Routes>
-                    {routes.map(({ path, Component }) => {
-                        return <Route key={path} path={path} element={<Component />} />
-                    })}
-                </Routes>
-            </Layout>
+            <App>
+                <Route />
+            </App>
         </BrowserRouter>
     </React.StrictMode>
 )

package/template/react-vite/src/pages/404/View.tsx

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

package/template/react-vite/src/pages/404/index.ts

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

package/template/react-vite/src/router/View.tsx

@@ -0,0 +1,6 @@
+import { useRoutes } from 'react-router-dom'
+import routes from './routes'
+
+export default function Route() {
+    return useRoutes(routes)
+}

package/template/react-vite/src/router/index.ts

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

package/template/react-vite/src/router/routes.tsx

@@ -0,0 +1,16 @@
+import { RouteObject } from 'react-router-dom'
+import Home from '@/pages/Home'
+import CannotAccess from '@/pages/404'
+
+const routes: RouteObject[] = [
+    {
+        path: '/',
+        element: <Home />
+    },
+    {
+        path: '*',
+        element: <CannotAccess />
+    }
+]
+
+export default routes

package/template/vue-vite/READEME.md

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

package/template/vue-vite/src/App/app.container.vue

@@ -0,0 +1,10 @@
+<template>
+    <router-view />
+</template>
+
+<script setup lang="ts">
+import { useInit } from './app.controller'
+useInit()
+</script>
+
+<style scoped></style>

package/template/vue-vite/src/App/app.controller.ts

@@ -0,0 +1,7 @@
+import { onMounted } from 'vue'
+
+export function useInit() {
+    onMounted(() => {
+        console.log('init')
+    })
+}

package/template/vue-vite/src/App/app.store.ts

@@ -0,0 +1,14 @@
+import { defineStore } from 'pinia'
+
+export default defineStore('app', {
+    state: () => {
+        return {
+            appName: ''
+        }
+    },
+    actions: {
+        setAppName(appName: string) {
+            this.appName = appName
+        }
+    }
+})

package/template/vue-vite/src/App/index.ts

@@ -1,2 +1,3 @@
-export * from './controllers'
-export { default } from './View.vue'
+export { default } from './app.container.vue'
+export { default as useAppStore } from './app.store'
+export * from './app.controller'

package/template/vue-vite/src/pages/404/View.vue

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

package/template/vue-vite/src/pages/404/index.ts

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

package/template/vue-vite/src/routes/index.ts

@@ -1,9 +1,22 @@
 import { createRouter, createWebHashHistory, RouteRecordRaw } from 'vue-router'
 import Home from '@/pages/Home'
+import CannotAccess from '@/pages/404'
+import routeNames from './routeNames'
 
-const routes: RouteRecordRaw[] = [{ path: '/', component: Home }]
-
-export default createRouter({
+const routes: (RouteRecordRaw & { name: string })[] = [
+    { path: '/', name: routeNames.home, component: Home },
+    { path: '/404', name: routeNames.cannotAccess, component: CannotAccess }
+]
+const router = createRouter({
     history: createWebHashHistory(),
     routes
 })
+router.beforeEach(async to => {
+    if (!Object.values(routeNames).includes(to.name! as string)) {
+        return {
+            replace: true,
+            name: routeNames.cannotAccess
+        }
+    }
+})
+export default router

package/template/vue-vite/src/routes/routeNames.ts

@@ -0,0 +1,4 @@
+export default {
+    home: 'home',
+    cannotAccess: '404'
+}

package/template/react-vite/src/Layout/View.tsx

@@ -1,8 +0,0 @@
-import React, { PropsWithChildren } from 'react'
-import { LayoutPropsType } from './typings'
-
-function Layout({ children }: PropsWithChildren<LayoutPropsType>) {
-    return <div>{children}</div>
-}
-
-export default Layout

package/template/react-vite/src/Layout/index.ts

@@ -1,2 +0,0 @@
-export { default } from './View'
-export * as LayoutTypes from './typings'

package/template/react-vite/src/Layout/typings.ts

@@ -1 +0,0 @@
-export interface LayoutPropsType {}

package/template/react-vite/src/routes/index.ts

@@ -1,16 +0,0 @@
-import type { FunctionComponent } from 'react'
-import Home from '@/pages/Home'
-
-export interface routeType {
-    path: string
-    Component: FunctionComponent<any>
-}
-
-const routes: routeType[] = [
-    {
-        path: '/',
-        Component: Home
-    }
-]
-
-export default routes

package/template/vue-vite/src/App/View.vue

@@ -1,7 +0,0 @@
-<template>
-    <router-view />
-</template>
-
-<script setup lang="ts"></script>
-
-<style scoped></style>

package/template/vue-vite/src/App/controllers/index.ts

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

package/template/vue-vite/src/App/controllers/useApp.ts

@@ -1,9 +0,0 @@
-import { defineStore } from 'pinia'
-
-export const useApp = defineStore('app', {
-    state: () => {
-        return {
-            appName: ''
-        }
-    }
-})