🎉 version(architecture): v0.3

.github/workflows/Dockerfile

@@ -1,7 +1,7 @@
 FROM nginx
 # 复制构建文件到容器中
 COPY ./packages/apps/admin/dist/ /usr/share/nginx/html/
-COPY ./packages/apps/micro/dist/ /usr/share/nginx/html/micro/
+COPY ./packages/apps/micro-react/dist/ /usr/share/nginx/html/react/
 COPY ./packages/apps/micro-docs/dist/ /usr/share/nginx/html/docs/
 # 复制nginx配置到容器中
 COPY ./.github/workflows/nginx.conf /etc/nginx/nginx.conf

.github/workflows/docker-deploy.yml

@@ -26,8 +26,8 @@ jobs:
       - name: build @apps/admin
         run: pnpm --filter @apps/admin... build
 
-      - name: build @apps/micro
-        run: pnpm --filter @apps/micro... build
+      - name: build @apps/micro-react
+        run: pnpm --filter @apps/micro-react... build
 
       - name: build @apps/micro-docs
         run: pnpm --filter @apps/micro-docs... build

.github/workflows/nginx.conf

@@ -51,23 +51,27 @@ http {
         # alias 或root 都是替换路径
         # location /micro 则最后不加/
         # location /micro/ 则最后加/
-        location /micro {
+        location /micro/react {
             if ($request_filename ~* .*\.(?:htm|html)$)  ## 配置页面不缓存html和htm结尾的文件
             {
                add_header Cache-Control "private, no-store, no-cache, must-revalidate, proxy-revalidate";
             }
             # 把匹配到的路径重写, 注意要以/结尾
-            alias /usr/share/nginx/html/micro;
+            alias /usr/share/nginx/html/react;
             # 默认首页
             index  index.html;
-            try_files $uri $uri/ /micro/index.html;
-
-#             location ~ .*\.(js|css)?$
-#               {
-#                   expires      12h;
-#                   error_log off;
-#                   access_log /dev/null;
-#               }
+            try_files $uri $uri/ /react/index.html;
+        }
+        location /micro/docs {
+            if ($request_filename ~* .*\.(?:htm|html)$)  ## 配置页面不缓存html和htm结尾的文件
+            {
+               add_header Cache-Control "private, no-store, no-cache, must-revalidate, proxy-revalidate";
+            }
+            # 把匹配到的路径重写, 注意要以/结尾
+            alias /usr/share/nginx/html/docs;
+            # 默认首页
+            index  index.html;
+            try_files $uri $uri/ /docs/index.html;
         }
         # 定义 404 页面
         error_page  404              /404.html;
@@ -114,10 +118,18 @@ http {
             expires -1;                          # 首页一般没有强制缓存
             add_header Cache-Control no-cache;
 
-            add_header "Access-Control-Allow-Origin" "*";   # 全局变量获得当前请求origin，带cookie的请求不支持*
+            add_header "Access-Control-Allow-Origin" $http_origin;   # 全局变量获得当前请求origin，带cookie的请求不支持*
             add_header "Access-Control-Allow-Methods" "*";  # 允许请求方法
             add_header "Access-Control-Allow-Headers" "*";  # 允许请求的 header
         }
+        location ~*\.(js|css|png|jpg|jpeg|gif|ico)$ {
+            add_header Access-Control-Allow-Origin *;
+            add_header Access-Control-Allow-Methods 'GET, POST, OPTIONS';
+            add_header Access-Control-Allow-Headers 'DNT,X-Mx-ReqToken,Keep-Alive,User-Agent,X-Requested-With,If-Modified-Since,Cache-Control,Content-Type,Authorization';
+
+            root   /usr/share/nginx/html/docs;
+            expires 30d;
+        }
     }
 }
 

packages/apps/admin/mock/module/user/user.ts

@@ -83,12 +83,12 @@ const menu = {
         icon: 'Brush',
         module: 'docs'
       },
-      // component: 'LAYOUT',
+      component: 'LAYOUT',
       path: '/docs/repackage',
       children: [
         {
           name: 'repackage_home',
-          path: '/docs/repackage/home',
+          path: '/repackage/home',
           meta: {
             title: '🔥Vue二次封装思考',
             module: 'docs'

packages/apps/admin/src/components.d.ts

@@ -7,8 +7,6 @@ export {}
 
 declare module 'vue' {
   export interface GlobalComponents {
-    CodeBlock: typeof import('./components/code-block/index.vue')['default']
-    DocsLayout: typeof import('./components/docs-layout/index.vue')['default']
     ElAside: typeof import('element-plus/es')['ElAside']
     ElBreadcrumb: typeof import('element-plus/es')['ElBreadcrumb']
     ElBreadcrumbItem: typeof import('element-plus/es')['ElBreadcrumbItem']
@@ -20,7 +18,6 @@ declare module 'vue' {
     ElDropdown: typeof import('element-plus/es')['ElDropdown']
     ElDropdownItem: typeof import('element-plus/es')['ElDropdownItem']
     ElDropdownMenu: typeof import('element-plus/es')['ElDropdownMenu']
-    ElEmpty: typeof import('element-plus/es')['ElEmpty']
     ElHeader: typeof import('element-plus/es')['ElHeader']
     ElIcon: typeof import('element-plus/es')['ElIcon']
     ElMain: typeof import('element-plus/es')['ElMain']
@@ -29,14 +26,7 @@ declare module 'vue' {
     ElSubMenu: typeof import('element-plus/es')['ElSubMenu']
     ElTabPane: typeof import('element-plus/es')['ElTabPane']
     ElTabs: typeof import('element-plus/es')['ElTabs']
-    Icon: typeof import('./components/icon/icon.vue')['default']
-    IndexOnce: typeof import('./components/docs-layout/navigation/index-once.vue')['default']
-    Markdown: typeof import('./components/markdown/index.vue')['default']
     RouterLink: typeof import('vue-router')['RouterLink']
     RouterView: typeof import('vue-router')['RouterView']
-    SoundCodeOnce: typeof import('./components/code-block/sound-code-once.vue')['default']
-    SoundPathOnce: typeof import('./components/code-block/sound-path-once.vue')['default']
-    SvgIcon: typeof import('./components/icon/svg-icon.vue')['default']
-    TreeOnce: typeof import('./components/docs-layout/navigation/tree-once.vue')['default']
   }
 }

packages/apps/admin/src/router/routerGuards.ts

@@ -28,7 +28,6 @@ export function createRouterGuards(router: Router) {
    * @description 路由跳转前执行守卫
    */
   router.beforeEach(async (to, from, next) => {
-    console.log('======= 路由beforeEach =======', to, from)
     NProgress.start()
     // 登录后如果重定向失败即重定向到首页
     if (from.path === LOGIN_PATH && to.name === ERROR_PAGE_NAME) {
@@ -131,6 +130,7 @@ export function transRouter(auth: Omit<IMenu, 'children'>[]): AppRouteRecordRaw[
     name: key,
     component: 'LAYOUT',
     path: `/${key}`,
+    redirect: grouped[key]?.[0]?.path || '/',
     children: grouped[key].map((item) => ({
       component: item?.name,
       path: item?.path || '',

packages/apps/admin/src/views/layouts/micro/index.vue

@@ -1,5 +1,11 @@
 <template>
-  <micro-app :name="name" :url="url" :iframe="isIframe" router-mode="native" />
+  <micro-app
+    :name="name"
+    :url="url"
+    :baseroute="`/${name}/`"
+    :iframe="isIframe"
+    router-mode="native"
+  />
 </template>
 
 <script setup lang="ts">

packages/apps/micro-docs/src/global.d.ts

@@ -2,4 +2,5 @@ declare interface Window {
   unmount: () => void
   mount: () => void
   __MICRO_APP_ENVIRONMENT__: boolean
+  __MICRO_APP_BASE_ROUTE__: string | undefined
 }

packages/apps/micro-docs/src/router/index.ts

@@ -26,10 +26,11 @@ export const asyncRoutes = [...routeModuleList]
 //普通路由 无需验证权限
 export const constantRouter: any[] = [...routeModuleList, ErrorPageRoute]
 
+console.log('window.__MICRO_APP_BASE_ROUTE__', window.__MICRO_APP_BASE_ROUTE__)
 // 创建路由
 const router = createRouter({
   // history: process.env.NODE_ENV === 'production' ? createWebHistory() : createWebHashHistory(),
-  history: createWebHistory(import.meta.env.PROD ? '/docs' : '/docs'),
+  history: createWebHistory(window.__MICRO_APP_BASE_ROUTE__ || '/docs/'),
   routes: constantRouter as unknown as RouteRecordRaw[],
   scrollBehavior() {
     return { left: 0, top: 0 }

packages/apps/micro-docs/src/router/modules/repackage.ts

@@ -12,7 +12,7 @@ import { RouteRecordRaw } from 'vue-router'
  * */
 const routes: Array<RouteRecordRaw> = [
   {
-    path: '/home',
+    path: '/repackage/home',
     name: 'repackage_home',
     component: () => import('@/views/repackage/home/index.docs.vue')
   }

packages/apps/micro-docs/src/views/system/micro/demo/micro-app.demo.vue

@@ -4,5 +4,5 @@
 
 <script setup lang="ts">
   import { useMicro } from '@tingcode/system'
-  const { name, url } = useMicro('micro')
+  const { name, url } = useMicro('react')
 </script>

packages/apps/micro-docs/vite.config.ts

@@ -26,7 +26,7 @@ export default defineConfig(({ command, mode }) => {
   const env = loadEnv(mode, process.cwd())
   console.log(env, command)
   return {
-    base: command === 'build' ? '/docs/' : '/docs/',
+    base: command === 'build' ? '/micro/docs/' : '/micro/docs/',
     plugins: [
       vue({
         include: [/\.vue$/, /\.md$/] // markdown 兼容

packages/apps/micro/package.json → packages/apps/micro-react/package.json

@@ -1,5 +1,5 @@
 {
-  "name": "@apps/micro",
+  "name": "@apps/micro-react",
   "private": true,
   "version": "0.0.0",
   "scripts": {

packages/apps/micro/rspack.config.js → packages/apps/micro-react/rspack.config.js

@@ -18,7 +18,7 @@ module.exports = function (env, argv) {
     },
     devtool: false, // 关闭sourceMap
     output: {
-      publicPath: isProdMode ? '/micro/' : '/', // history路由
+      publicPath: isProdMode ? '/micro/react/' : '/', // history路由
       path: path.resolve(__dirname, 'dist'),
       filename: 'file/[name]-[hash:6][ext]',
       chunkFilename: 'chunk/[name]-[hash:6][ext]',

packages/apps/micro/src/router/index.tsx → packages/apps/micro-react/src/router/index.tsx

@@ -3,5 +3,5 @@ import { routers } from '@/router/baseRouters'
 import { isProdMode } from '@/utils/env'
 
 export const router: any = createBrowserRouter(routers, {
-  basename: isProdMode() ? '/micro' : ''
+  basename: isProdMode() ? '/micro/react' : ''
 })

packages/lib/system/src/hooks/micro.ts

@@ -4,12 +4,12 @@ import { error } from '@tingcode/utils'
 
 // 'development' | 'production'
 export const devMicroUrlMap = {
-  docs: 'http://localhost:8680/docs/',
-  micro: 'http://139.199.173.241/'
+  docs: 'http://localhost:8680/micro/docs/',
+  react: ' http://localhost:8080/'
 }
 export const proMicroUrlMap = {
-  docs: 'http://139.199.173.241:8680/docs/',
-  micro: 'http://139.199.173.241/micro/'
+  docs: 'http://139.199.173.241/micro/docs/',
+  react: 'http://139.199.173.241/micro/react/'
 }
 const IFRAME = ['docs']
 

packages/lib/system/src/hooks/router.ts

@@ -10,7 +10,7 @@ export enum PageEnum {
   REDIRECT = '/redirect',
   REDIRECT_NAME = 'Redirect',
   // 首页
-  BASE_HOME = 'docs/system/home',
+  BASE_HOME = '/docs/system/home',
   BASE_HOME_NAME = 'system_home',
   // 错误
   ERROR_PAGE_NAME = 'ErrorPage'
@@ -73,19 +73,12 @@ export async function setUrl(to: RouterTarget) {
       urlObj.searchParams.set(key, query[key])
     }
   }
-  console.log(
-    '路由跳转======',
-    name,
-    urlObj.toString(),
-    microApp.getActiveApps(),
-    microApp.getAllApps()
-  )
-
+  console.log('路由跳转======', name, urlObj, microApp.getActiveApps(), microApp.getAllApps())
   try {
     if (!name) {
       return error('no app name')
     }
-    console.log('====== microApp路由跳转 ======', { name, path: urlObj.toString() })
+    console.log('====== microApp路由跳转 ======', { name, path: urlObj.pathname + urlObj.search })
     return await microApp.router.push({ name, path: urlObj.toString(), replace: !!replace })
   } catch (e) {
     console.log('====== 原生路由跳转 ======')