create-young-proj 0.1.0 → 0.2.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "create-young-proj",
-  "version": "0.1.0",
+  "version": "0.2.0",
   "description": "create project from template",
   "main": "index.mjs",
   "bin": {
@@ -45,8 +45,8 @@
   "scripts": {
     "dev": "unbuild --stub",
     "build": "unbuild",
-    "format": "rome format * --write",
-    "release": "changelogen && bumpp --commit --tag --no-push",
+    "format": "rome format . --write",
+    "release": "changelogen && bumpp --no-push",
     "push": "pnpm publish --access public"
   }
 }

package/template-admin-server/package.json

@@ -45,7 +45,7 @@
     "start": "cross-env NODE_ENV=production node ./boot.mjs",
     "dev": "cross-env NODE_ENV=local midway-bin dev --ts",
     "build": "midway-bin build -c",
-    "format": "rome format . --write"
+    "format": "rome format * --write"
   },
   "midway-bin-clean": [
     ".vscode/.tsbuildinfo",
@@ -57,4 +57,4 @@
   },
   "author": "BluesYoung-web",
   "license": "MIT"
-}
+}

package/template-vue-admin/build/custom-plugin.ts

@@ -0,0 +1,30 @@
+/*
+ * @Author: zhangyang
+ * @Date: 2023-01-10 14:43:13
+ * @LastEditTime: 2023-01-10 15:11:44
+ * @Description:
+ */
+import { networkInterfaces } from 'node:os';
+
+const virtualModuleId = 'virtual:local-server';
+const ips = networkInterfaces();
+export const localServer = `http://${ips['eth0'][0].address}:3000`;
+
+/**
+ * 获取本机 ip 地址，拼接开发时的服务地址
+ */
+export const serverPlugin = () => {
+  return {
+    name: 'local-server',
+    resolveId(id) {
+      if (id === virtualModuleId) {
+        return virtualModuleId;
+      }
+    },
+    load(id) {
+      if (id === virtualModuleId) {
+        return `export const server = '${localServer}';`;
+      }
+    },
+  };
+};

package/template-vue-admin/build/index.ts

@@ -0,0 +1,7 @@
+/*
+ * @Author: zhangyang
+ * @Date: 2023-01-10 14:46:42
+ * @LastEditTime: 2023-01-10 14:46:43
+ * @Description:
+ */
+export * from './plugins';

package/template-vue-admin/build/plugins.ts

@@ -0,0 +1,59 @@
+/*
+ * @Author: zhangyang
+ * @Date: 2023-01-10 14:26:01
+ * @LastEditTime: 2023-01-10 15:18:31
+ * @Description:
+ */
+import type { PluginOption } from 'vite';
+import { serverPlugin } from './custom-plugin';
+import vue from '@vitejs/plugin-vue';
+import vueJsx from '@vitejs/plugin-vue-jsx';
+import legacy from '@vitejs/plugin-legacy';
+import Unocss from 'unocss/vite';
+// 自动导入
+import AutoImport from 'unplugin-auto-import/vite';
+import AutoComopnents from 'unplugin-vue-components/vite';
+import { ElementPlusResolver } from 'unplugin-vue-components/resolvers';
+// 自动路由及布局
+import Pages from 'vite-plugin-pages';
+import Layouts from 'vite-plugin-vue-layouts';
+
+export { localServer } from './custom-plugin';
+
+export const usePlugins = () => {
+  return [
+    serverPlugin(),
+    vue(),
+    vueJsx(),
+    Pages({
+      extensions: ['vue', 'tsx'],
+      dirs: 'src/views',
+      exclude: ['**/components/*.{vue,tsx}', '_*'],
+    }),
+    Layouts({ defaultLayout: 'default/index' }),
+    AutoComopnents({
+      dirs: ['src/components'],
+      dts: './src/auto-components.d.ts',
+      extensions: ['vue', 'tsx'],
+      resolvers: [ElementPlusResolver()],
+    }),
+    AutoImport({
+      dts: './src/auto-imports.d.ts',
+      imports: [
+        'vue',
+        'vue-router',
+        '@vueuse/core',
+        'pinia',
+        {
+          'element-plus': ['ElMessage', 'ElMessageBox', 'ElLoadingService'],
+        },
+      ],
+    }),
+    Unocss(),
+    // 不生成同名 polyfill 文件，打包速度翻倍
+    // 如果出现兼容问题，可以删除此配置
+    legacy({
+      // renderLegacyChunks: false
+    }),
+  ] as PluginOption[];
+};

package/template-vue-admin/package.json

@@ -8,7 +8,7 @@
     "dev:server": "nitropack dev",
     "build": "vite build && nitropack build",
     "preview": "vite preview --host",
-    "format": "rome format .* --write",
+    "format": "rome format * --write",
     "release": "changelogen && bumpp --no-push"
   },
   "dependencies": {

package/template-vue-admin/src/main.ts

@@ -1,7 +1,7 @@
 /*
  * @Author: zhangyang
  * @Date: 2022-12-03 15:57:40
- * @LastEditTime: 2023-01-04 14:30:48
+ * @LastEditTime: 2023-01-10 15:09:29
  * @Description:
  */
 // polyfill
@@ -13,6 +13,7 @@ import 'uno.css';
 import 'element-plus/dist/index.css';
 
 import { createApp } from 'vue';
+import { server } from 'virtual:local-server';
 import App from './App.vue';
 
 (async () => {
@@ -23,9 +24,8 @@ import App from './App.vue';
     viteEnv = import.meta.env;
     console.log('🚀 ~ file: main.ts ~ line 19 ~ viteEnv', viteEnv);
   } else if (import.meta.env.DEV) {
-    // 开发环境，内网其他设备访问请切换为局域网 ip
-    // 端口号与环境变量的 SERVER_PORT 保持一致
-    viteEnv = await (await fetch(`http://127.0.0.1:3000/get/env`)).json();
+    // 开发环境，局域网 ip
+    viteEnv = await (await fetch(server + '/get/env')).json();
     console.log('🚀 ~ file: main.ts ~ line 24 ~ viteEnv', viteEnv);
   } else {
     // 部署环境，需要配合 nginx 使用

package/template-vue-admin/src/modules/4-auth.ts

@@ -1,7 +1,7 @@
 /*
  * @Author: zhangyang
  * @Date: 2022-03-01 19:40:13
- * @LastEditTime: 2023-01-09 09:19:41
+ * @LastEditTime: 2023-01-11 10:32:35
  * @Description: 权限校验
  */
 import { router } from './1-router';
@@ -84,7 +84,6 @@ export const install: UserModule = (app) => {
       (await casdoorLogin(code, state)) as UserKey;
       getToken() && (await generateNavData());
       location.search = '';
-      changeTitle(to);
       return true;
     } else 
     */
@@ -99,12 +98,10 @@ export const install: UserModule = (app) => {
         await generateNavData();
         if (hasPermission(to.meta.authPath)) {
           // 拥有对应页面的权限
-          changeTitle(to);
           return true;
         }
         if (!hasPermission(to.meta.authPath)) {
           // 已登录，并且无权限
-          changeTitle(from);
           return '/403';
         }
       } else {
@@ -117,6 +114,13 @@ export const install: UserModule = (app) => {
 
   router.afterEach((to) => {
     const { addView } = useTagsStore();
+    const nav = FlatNavArr.value.find((item) => item.component === to.path);
+    if (nav && nav.title) {
+      // console.log('before: ', to.meta);
+      to.meta.title = nav.title as string;
+      // console.log('after: ', to.meta);
+    }
     addView(to);
+    changeTitle(to);
   });
 };

package/template-vue-admin/src/shims.d.ts

@@ -0,0 +1,12 @@
+/*
+ * @Author: zhangyang
+ * @Date: 2023-01-10 15:08:44
+ * @LastEditTime: 2023-01-10 15:08:44
+ * @Description: 
+ */
+declare module 'virtual:local-server' {
+  /**
+   * 本地服务地址
+   */
+  export const server: string;
+}

package/template-vue-admin/tsconfig.node.json

@@ -5,5 +5,5 @@
     "moduleResolution": "Node",
     "allowSyntheticDefaultImports": true
   },
-  "include": ["vite.config.ts"]
+  "include": ["vite.config.ts", "build/**/*.ts"]
 }

package/template-vue-admin/vite.config.ts

@@ -1,26 +1,13 @@
 /*
  * @Author: zhangyang
  * @Date: 2022-12-03 15:57:40
- * @LastEditTime: 2023-01-05 14:14:02
+ * @LastEditTime: 2023-01-10 15:12:20
  * @Description:
  */
 import { fileURLToPath, URL } from 'node:url';
 import { defineConfig, loadEnv } from 'vite';
 import type { ConfigEnv, UserConfigExport } from 'vite';
-
-import vue from '@vitejs/plugin-vue';
-import vueJsx from '@vitejs/plugin-vue-jsx';
-import legacy from '@vitejs/plugin-legacy';
-import Unocss from 'unocss/vite';
-
-// 自动导入
-import AutoImport from 'unplugin-auto-import/vite';
-import AutoComopnents from 'unplugin-vue-components/vite';
-import { ElementPlusResolver } from 'unplugin-vue-components/resolvers';
-
-// 自动路由及布局
-import Pages from 'vite-plugin-pages';
-import Layouts from 'vite-plugin-vue-layouts';
+import { usePlugins, localServer } from './build';
 
 // https://vitejs.dev/config/
 export default ({ command, mode }: ConfigEnv): UserConfigExport => {
@@ -29,39 +16,7 @@ export default ({ command, mode }: ConfigEnv): UserConfigExport => {
   console.log('🚀 ~ file: vite.config.ts ~ line 36 ~ viteEnv', viteEnv);
   return defineConfig({
     base: './',
-    plugins: [
-      vue(),
-      vueJsx(),
-      Pages({
-        extensions: ['vue', 'tsx'],
-        dirs: 'src/views',
-        exclude: ['**/components/*.{vue,tsx}', '_*'],
-      }),
-      Layouts({ defaultLayout: 'default/index' }),
-      AutoComopnents({
-        dirs: ['src/components'],
-        dts: './src/auto-components.d.ts',
-        extensions: ['vue', 'tsx'],
-        resolvers: [ElementPlusResolver()],
-      }),
-      AutoImport({
-        dts: './src/auto-imports.d.ts',
-        imports: [
-          'vue',
-          'vue-router',
-          '@vueuse/core',
-          'pinia',
-          {
-            'element-plus': ['ElMessage', 'ElMessageBox', 'ElLoadingService'],
-          },
-        ],
-      }),
-      Unocss(),
-      legacy({
-        // 不生成同名 polyfill 文件，打包速度翻倍，如果出现兼容问题，可以删除此配置
-        // renderLegacyChunks: false
-      }),
-    ],
+    plugins: usePlugins(),
     resolve: {
       alias: {
         '@': fileURLToPath(new URL('./src', import.meta.url)),
@@ -70,7 +25,7 @@ export default ({ command, mode }: ConfigEnv): UserConfigExport => {
     server: {
       host: true,
       proxy: {
-        '/api': 'http://192.168.10.168:3000',
+        '/api': localServer,
       },
     },
   });

package/template-vue-mobile/.vscode/base.code-snippets

@@ -0,0 +1,24 @@
+{
+  "mobile base": {
+    "prefix": "base",
+    "body": [
+      "<route lang=\"yaml\">",
+      "meta:",
+      "  auth: true",
+      "  title: $1",
+      "  layout: sub",
+      "</route>",
+      "",
+      "<script lang=\"ts\" setup>",
+      "$2",
+      "</script>",
+      "",
+      "<template>",
+      "  <div>",
+      "    $1",
+      "  </div>",
+      "</template>",
+    ],
+    "description": "mobile base"
+  }
+}

package/template-vue-mobile/.vscode/extensions.json

@@ -0,0 +1,10 @@
+{
+  "recommendations": [
+    "vue.volar",
+    "rome.rome",
+    "obkoro1.korofileheader",
+    "vue.vscode-typescript-vue-plugin",
+    "antfu.unocss",
+    "voorjaar.windicss-intellisense"
+  ]
+}

package/template-vue-mobile/.vscode/settings.json

@@ -0,0 +1,7 @@
+{
+  "editor.formatOnSave": true,
+  "editor.defaultFormatter": "rome.rome",
+  "[vue]": {
+    "editor.defaultFormatter": "Vue.volar"
+  }
+}

package/template-vue-mobile/Dockerfile

@@ -0,0 +1,42 @@
+# 拉取基础镜像
+FROM node:16-alpine as builder
+
+# 维护者
+MAINTAINER BluesYoung "bluesyoung_web@163.com"
+
+# 工作目录
+WORKDIR /app
+
+# 没有压缩包，首选 COPY，如果需要自动解包或下载，则使用 ADD
+
+# 对比依赖是否变更
+COPY package.json yarn.lock /app/
+
+# 设置npm仓库 + 下载依赖，上面的文件如果没有变化则跳过下载，直接使用缓存
+RUN npm config set registry https://registry.npmmirror.com && \
+    yarn config set registry https://registry.npmmirror.com && \        
+    yarn
+
+# 加入代码
+COPY . /app
+# 打包
+RUN yarn build
+
+# 打包完成，构建最终的极简镜像
+FROM node:16-alpine
+
+# 工作目录
+WORKDIR /app
+
+# 复制运行需要的文件[及依赖]
+# 直接复制源代码
+COPY boot.mjs /app/
+COPY config /app/config
+# 复制上一步的打包产物
+COPY --from=builder /app/.output /app/.output
+
+# 暴露指定的端口号，暂不需要
+# EXPOSE 3001
+
+# 启动容器时运行的命令
+ENTRYPOINT ["node", "boot.mjs"]

package/template-vue-mobile/README.md

@@ -0,0 +1,71 @@
+# h5 模板
+
+## 用户代码片段(页面模板)
+
+模板 | 触发关键字
+--- | ---
+基础页面 | `base`
+
+## **Docker 部署**
+
+- 同一份代码，可以根据运行时的环境变量决定具体表现
+- `node` 服务：
+  - 托管前端静态资源
+  - 根据环境变量读取对应的配置文件，并以接口的形式暴露给前端
+  - 跨域接口代理
+
+环境变量
+
+```sh
+# 部署环境 dev | test | online
+DEPLOY_ENV=dev
+# DEPLOY_ENV=test
+# DEPLOY_ENV=online
+# node 服务监听的端口号
+LISTEN_PORT=3000
+```
+
+### 本地开发
+
+**确保上述的环境变量存在**
+
+启动服务端程序 `yarn dev:server`
+
+启动客户端程序 `yarn dev`
+
+### 打包预览
+
+`yarn build`
+
+**确保上述的环境变量存在！！！**
+
+`node boot.mjs`
+
+### 配置文件
+
+存放于 `config` 目录下的 `.${env}rc` 文件，`env` 为对应的环境标识
+
+## 常规部署
+
+- `nginx` 托管前端静态资源
+- 每次打包时读取环境变量，打包完成之后不可变
+- 使用 `nginx` 代理跨域
+
+环境变量
+
+```sh
+# 设置静态部署
+VITE_USE_DEFAULT_DEPLOY_METHOD=true
+# 其他的环境变量，根据环境区分
+VITE_TITLE=标题名称
+```
+
+### 本地开发
+
+**确保上述的环境变量存在**，然后 `yarn dev` 即可
+
+### 打包预览
+
+`yarn build`
+
+`yarn preview`

package/template-vue-mobile/_env

@@ -0,0 +1,6 @@
+# 部署环境 dev | test | online
+DEPLOY_ENV=dev
+# DEPLOY_ENV=test
+# DEPLOY_ENV=online
+# node 服务监听的端口号
+LISTEN_PORT=3003

package/template-vue-mobile/_gitignore

@@ -0,0 +1,30 @@
+# Logs
+logs
+*.log
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+pnpm-debug.log*
+lerna-debug.log*
+
+node_modules
+dist
+dist-ssr
+*.local
+.env
+
+# Editor directories and files
+.vscode/*
+!.vscode/extensions.json
+!.vscode/settings.json
+!.vscode/*.code-snippets
+.idea
+.DS_Store
+*.suo
+*.ntvs*
+*.njsproj
+*.sln
+*.sw?
+
+.nitro
+.output

package/template-vue-mobile/boot.mjs

@@ -0,0 +1,16 @@
+/*
+ * @Author: zhangyang
+ * @Date: 2022-09-16 11:48:05
+ * @LastEditTime: 2022-12-29 16:21:59
+ * @Description:
+ */
+(async () => {
+  const env = process.env.DEPLOY_ENV;
+  const listenPort = process.env.LISTEN_PORT || 3003;
+  console.log('当前环境：', env);
+  console.log('服务监听端口：', listenPort);
+
+  process.env.NITRO_PORT = listenPort;
+
+  await import('./.output/server/index.mjs');
+})();

package/template-vue-mobile/build/custom-plugin.ts

@@ -0,0 +1,30 @@
+/*
+ * @Author: zhangyang
+ * @Date: 2023-01-10 14:43:13
+ * @LastEditTime: 2023-01-10 15:11:44
+ * @Description:
+ */
+import { networkInterfaces } from 'node:os';
+
+const virtualModuleId = 'virtual:local-server';
+const ips = networkInterfaces();
+export const localServer = `http://${ips['eth0'][0].address}:3000`;
+
+/**
+ * 获取本机 ip 地址，拼接开发时的服务地址
+ */
+export const serverPlugin = () => {
+  return {
+    name: 'local-server',
+    resolveId(id) {
+      if (id === virtualModuleId) {
+        return virtualModuleId;
+      }
+    },
+    load(id) {
+      if (id === virtualModuleId) {
+        return `export const server = '${localServer}';`;
+      }
+    },
+  };
+};

package/template-vue-mobile/build/index.ts

@@ -0,0 +1,7 @@
+/*
+ * @Author: zhangyang
+ * @Date: 2023-01-10 14:46:42
+ * @LastEditTime: 2023-01-10 14:46:43
+ * @Description:
+ */
+export * from './plugins';

package/template-vue-mobile/build/plugins.ts

@@ -0,0 +1,68 @@
+/*
+ * @Author: zhangyang
+ * @Date: 2023-01-10 14:26:01
+ * @LastEditTime: 2023-01-13 15:54:55
+ * @Description:
+ */
+import type { PluginOption } from 'vite';
+import { serverPlugin } from './custom-plugin';
+import vue from '@vitejs/plugin-vue';
+import vueJsx from '@vitejs/plugin-vue-jsx';
+import legacy from '@vitejs/plugin-legacy';
+import Unocss from 'unocss/vite';
+// 自动导入
+import AutoImport from 'unplugin-auto-import/vite';
+import AutoComopnents from 'unplugin-vue-components/vite';
+import { VantResolver } from 'unplugin-vue-components/resolvers';
+// 自动路由及布局
+import Pages from 'vite-plugin-pages';
+import Layouts from 'vite-plugin-vue-layouts';
+
+export { localServer } from './custom-plugin';
+
+export const usePlugins = () => {
+  return [
+    serverPlugin(),
+    vue(),
+    vueJsx(),
+    Pages({
+      extensions: ['vue', 'tsx'],
+      dirs: 'src/views',
+      exclude: ['**/components/*.{vue,tsx}', '_*'],
+    }),
+    Layouts({ defaultLayout: 'default' }),
+    AutoComopnents({
+      dirs: ['src/components'],
+      dts: './src/auto-components.d.ts',
+      extensions: ['vue', 'tsx'],
+      resolvers: [VantResolver()],
+    }),
+    AutoImport({
+      dts: './src/auto-imports.d.ts',
+      imports: [
+        'vue',
+        'vue-router',
+        '@vueuse/core',
+        'pinia',
+        {
+          vant: [
+            'showToast',
+            'showLoadingToast',
+            'showFailToast',
+            'showSuccessToast',
+            'showDialog',
+            'showConfirmDialog',
+            'showImagePreview',
+            'showNotify',
+          ],
+        },
+      ],
+    }),
+    Unocss(),
+    // 不生成同名 polyfill 文件，打包速度翻倍
+    // 如果出现兼容问题，可以删除此配置
+    legacy({
+      // renderLegacyChunks: false
+    }),
+  ] as PluginOption[];
+};

package/template-vue-mobile/config/.devrc

@@ -0,0 +1,2 @@
+VITE_TITLE = Mobile-dev
+VITE_ENABLE_VCONSOLE = true

package/template-vue-mobile/config/.onlinerc

@@ -0,0 +1 @@
+VITE_TITLE = Mobile-online

package/template-vue-mobile/config/.testrc

@@ -0,0 +1 @@
+VITE_TITLE = Mobile-test

package/template-vue-mobile/index.html

@@ -0,0 +1,25 @@
+<!DOCTYPE html>
+<html lang="zh-CN">
+
+<head>
+  <meta charset="UTF-8" />
+  <link rel="icon" type="image/svg+xml" href="/vite.svg" />
+  <meta id="viewportMeta" name="viewport"
+    content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0,viewport-fit=cover">
+  <title>Vite + Vue + TS</title>
+  <script>
+    // hack globalThis
+    this.globalThis || (this.globalThis = this);
+    window.onerror = function (e) {
+      console.log(e);
+      window.alert('您的浏览器版本过低，请尝试使用其他浏览器或将浏览器升级至最新版本后重试！');
+    }
+  </script>
+</head>
+
+<body>
+  <div id="app"></div>
+  <script type="module" src="/src/main.ts"></script>
+</body>
+
+</html>