[Feature Request] 后期可以在文档中加入基于vite的配置指导吗? #1268

uicheung · 2021-02-19T09:45:03Z

后期可以在文档中加入基于vite的配置的例子和或者一些api吗?

Easy-Martin · 2021-02-23T12:31:32Z

同问

gongshun · 2021-02-26T03:46:56Z

与 #1257 重复

jpx5028254 · 2021-03-02T07:38:27Z

请问啥时候文档能出对vite的支持吗

faner11 · 2021-03-23T07:06:03Z

希望可以支持vite

xiaoxin-sky · 2021-03-26T05:45:44Z

下面是我使用 Vite2 vue3 微应用接入qiankun 方法

目前qiankun 官方还没有出 vue3 和vite 的接入方法，下面写一下我是如何把 vite2 + vue3 接入乾坤的

1.配置 `vite.config.ts`

把项目打包成 umd 格式的js 文件

const { name } = require("./package");
export default ()=>{
	return defineConfig({
    //...其他配置
    build: {
      target: "esnext",
      lib: {
        name: `${name}-[name]`,
        entry: path.resolve(__dirname, "src/main.ts"),
        formats: ["umd"],
      },
    },
  })
}

2.改造路由配置

// src/router/router.ts

///...其他代码
const router = createRouter({
  history: createWebHashHistory(
    window.__POWERED_BY_QIANKUN__ ? "/app-vue/" : "/"
  ),
  routes,
});
export default router;

3.改造入口文件

//src/main.ts
import Vue from "vue";
import { createApp } from "vue";
import App from "./App.vue";
import router from "./router/router";
import { createRouter, createWebHashHistory } from "vue-router";

// let router;
let instance: Vue.App<Element>;

declare global {
  interface Window {
    __POWERED_BY_QIANKUN__?: string;
  }
}

interface IRenderProps {
  container: Element | string;
}

function render(props: IRenderProps) {
  const { container } = props;
  instance = createApp(App);
  instance
    .use(Antd)
    .use(router)
    .mount(
      container instanceof Element
        ? (container.querySelector("#app") as Element)
        : (container as string)
    );
}
// 独立运行时
if (!window.__POWERED_BY_QIANKUN__) {
  render({ container: "#app" });
}
//暴露主应用生命周期钩子
export async function bootstrap() {
  console.log("subapp bootstraped");
}

export async function mount(props: any) {
  console.log("mount subapp");
  render(props);
}

export async function unmount() {
  console.log("unmount college app");
  instance.unmount();
}

通过上面改造，打包之后，即可接入到主应用中

⚠️ 打包之后的项目没有入口 html 文件，因此你可以自己生成一个 index.html 在dist 目录中，也可以利用 @rollup/plugin-html 自动生成html并注入js 和css文件

jpx5028254 · 2021-03-26T05:50:20Z

感谢感谢，那么主应用的配置也方便发一下吗

…

------------------ 原始邮件 ------------------ 发件人: "umijs/qiankun" ***@***.***>; 发送时间: 2021年3月26日(星期五) 中午1:45 ***@***.***>; ***@***.******@***.***>; 主题: Re: [umijs/qiankun] [Feature Request] 后期可以在文档中加入基于vite的配置指导吗? (#1268) 下面是我使用 Vite2 vue3 微应用接入qiankun 方法目前qiankun 官方还没有出 vue3 和vite 的接入方法，下面写一下我是如何把 vite2 + vue3 接入乾坤的 1.配置 vite.config.ts 把项目打包成 umd 格式的js 文件 const { name } = require("./package"); export default ()=>{ return defineConfig({ //...其他配置 build: { target: "esnext", lib: { name: `${name}-[name]`, entry: path.resolve(__dirname, "src/main.ts"), formats: ["umd"], }, }, }) } 2.改造路由配置 // src/router/router.ts ///...其他代码 const router = createRouter({ history: createWebHashHistory( window.__POWERED_BY_QIANKUN__ ? "/app-vue/" : "/" ), routes, }); export default router; 3.改造入口文件 //src/main.ts import Vue from "vue"; import { createApp } from "vue"; import App from "./App.vue"; import router from "./router/router"; import { createRouter, createWebHashHistory } from "vue-router"; // let router; let instance: Vue.App<Element>; declare global { interface Window { __POWERED_BY_QIANKUN__?: string; } } interface IRenderProps { container: Element | string; } function render(props: IRenderProps) { const { container } = props; instance = createApp(App); instance .use(Antd) .use(router) .mount( container instanceof Element ? (container.querySelector("#app") as Element) : (container as string) ); } // 独立运行时 if (!window.__POWERED_BY_QIANKUN__) { render({ container: "#app" }); } //暴露主应用生命周期钩子 export async function bootstrap() { console.log("subapp bootstraped"); } export async function mount(props: any) { console.log("mount subapp"); render(props); } export async function unmount() { console.log("unmount college app"); instance.unmount(); } 通过上面改造，打包之后，即可接入到主应用中 ⚠️ 打包之后的项目没有入口 html 文件，因此你可以自己生成一个 index.html 在dist 目录中，也可以利用 @rollup/plugin-html 自动生成html并注入js 和css文件 — You are receiving this because you commented. Reply to this email directly, view it on GitHub, or unsubscribe.

xiaoxin-sky · 2021-03-26T05:53:34Z

主应用官网文档都很清楚了哈，参考官网

…

------------------ 原始邮件 ------------------ 发件人: "hello ***@***.***>; 发送时间: 2021年3月26日(星期五) 中午1:50 收件人: ***@***.***>; 抄送: ***@***.***>; ***@***.***>; 主题: Re: [umijs/qiankun] [Feature Request] 后期可以在文档中加入基于vite的配置指导吗? (#1268) 感谢感谢，那么主应用的配置也方便发一下吗

------------------&nbsp;原始邮件&nbsp;------------------ 发件人: "umijs/qiankun" ***@***.***&gt;; 发送时间:&nbsp;2021年3月26日(星期五) 中午1:45 ***@***.***&gt;; ***@***.******@***.***&gt;; 主题:&nbsp;Re: [umijs/qiankun] [Feature Request] 后期可以在文档中加入基于vite的配置指导吗? (#1268) 下面是我使用 Vite2 vue3 微应用接入qiankun 方法目前qiankun 官方还没有出 vue3 和vite 的接入方法，下面写一下我是如何把 vite2 + vue3 接入乾坤的 1.配置 vite.config.ts 把项目打包成 umd 格式的js 文件 const { name } = require("./package"); export default ()=&gt;{ return defineConfig({ //...其他配置 build: { target: "esnext", lib: { name: `${name}-[name]`, entry: path.resolve(__dirname, "src/main.ts"), formats: ["umd"], }, }, }) } 2.改造路由配置 // src/router/router.ts ///...其他代码 const router = createRouter({ history: createWebHashHistory( window.__POWERED_BY_QIANKUN__ ? "/app-vue/" : "/" ), routes, }); export default router; 3.改造入口文件 //src/main.ts import Vue from "vue"; import { createApp } from "vue"; import App from "./App.vue"; import router from "./router/router"; import { createRouter, createWebHashHistory } from "vue-router"; // let router; let instance: Vue.App<Element&gt;; declare global { interface Window { __POWERED_BY_QIANKUN__?: string; } } interface IRenderProps { container: Element | string; } function render(props: IRenderProps) { const { container } = props; instance = createApp(App); instance .use(Antd) .use(router) .mount( container instanceof Element ? (container.querySelector("#app") as Element) : (container as string) ); } // 独立运行时 if (!window.__POWERED_BY_QIANKUN__) { render({ container: "#app" }); } //暴露主应用生命周期钩子 export async function bootstrap() { console.log("subapp bootstraped"); } export async function mount(props: any) { console.log("mount subapp"); render(props); } export async function unmount() { console.log("unmount college app"); instance.unmount(); } 通过上面改造，打包之后，即可接入到主应用中 ⚠️ 打包之后的项目没有入口 html 文件，因此你可以自己生成一个 index.html 在dist 目录中，也可以利用 @rollup/plugin-html 自动生成html并注入js 和css文件 — You are receiving this because you commented. Reply to this email directly, view it on GitHub, or unsubscribe. — You are receiving this because you commented. Reply to this email directly, view it on GitHub, or unsubscribe.

transtone · 2021-04-07T11:18:51Z

如果报下面的错，需要加上 rollup 的配置。

UMD and IIFE output formats are not supported for code-splitting builds.

vite.config.js:

const { name } = require("./package");
export default ()=>{
	return defineConfig({
    //...其他配置
    build: {
      target: "esnext",
      lib: {
        name: `${name}-[name]`,
        entry: path.resolve(__dirname, "src/main.ts"),
        formats: ["umd"],
      },
      rollupOptions: {
        output: {
          inlineDynamicImports: true,
        },
      },
    },
  })
}

#1024

David-C-gd-y · 2021-04-22T06:43:45Z

下面是我使用Vite2 vue3微应用接收qiankun方法

目前qiankun官方还没有出vue3和vite的接收方法，下面写一下我是如何把vite2 + vue3接入乾坤的

1.配置 `vite.config.ts`

把项目打包成umd格式的js文件

const  { name }  =  require （“ ./package” ）; 
出口 默认 （）=> {
	回报 defineConfig （{ 
    // ...其他配置
    编译：{
      目标：“esnext” ，
      LIB：{
        名称：` $ {名称} - [名]` ，
        项：路径。决心（__dirname ， “ src / main.ts” ）），
        格式：[ “ umd” ] ，
      } ，
    } ，
  } ）
}

2.改造路由配置

// src / router / router.ts

/// ...其他代码
常量 路由器 =  createRouter （{
  历史：createWebHashHistory （
    窗口。__POWERED_BY_QIANKUN__？“/ APP-VUE /” ：“/” ）
  ，
  路线，} ）; 导出默认路由器;

3.改造入口文件

//src/main.ts
import Vue from "vue";
import { createApp } from "vue";
import App from "./App.vue";
import router from "./router/router";
import { createRouter, createWebHashHistory } from "vue-router";

// let router;
let instance: Vue.App<Element>;

declare global {
  interface Window {
    __POWERED_BY_QIANKUN__?: string;
  }
}

interface IRenderProps {
  container: Element | string;
}

function render(props: IRenderProps) {
  const { container } = props;
  instance = createApp(App);
  instance
    .use(Antd)
    .use(router)
    .mount(
      container instanceof Element
        ? (container.querySelector("#app") as Element)
        : (container as string)
    );
}
// 独立运行时
if (!window.__POWERED_BY_QIANKUN__) {
  render({ container: "#app" });
}
//暴露主应用生命周期钩子
export async function bootstrap() {
  console.log("subapp bootstraped");
}

export async function mount(props: any) {
  console.log("mount subapp");
  render(props);
}

export async function unmount() {
  console.log("unmount college app");
  instance.unmount();
}

通过上面改造，打包之后，即可接入到主应用中

⚠️ 打包之后的项目没有入口 html 文件，因此你可以自己生成一个 index.html 在dist 目录中，也可以利用 @rollup/plugin-html 自动生成html并注入js 和css文件

还有一些细节要注意，因为 vite 的 tree shaking，在 vite 2.0 + 的版本中的 vite.config.ts ，在 rollupOptions. preserveEntrySignatures 设置为 strict。如果设置为 false 会无法正常工作。

wangzhiwei1888 · 2021-05-10T03:24:58Z

下面是我使用Vite2 vue3微应用接收qiankun方法

目前qiankun官方还没有出vue3和vite的接收方法，下面写一下我是如何把vite2 + vue3接入乾坤的

1.配置 `vite.config.ts`

把项目打包成umd格式的js文件

const  { name }  =  require （“ ./package” ）; 
出口 默认 （）=> {
	回报 defineConfig （{ 
    // ...其他配置
    编译：{
      目标：“esnext” ，
      LIB：{
        名称：` $ {名称} - [名]` ，
        项：路径。决心（__dirname ， “ src / main.ts” ）），
        格式：[ “ umd” ] ，
      } ，
    } ，
  } ）
}

2.改造路由配置

// src / router / router.ts

/// ...其他代码
常量 路由器 =  createRouter （{
  历史：createWebHashHistory （
    窗口。__POWERED_BY_QIANKUN__？“/ APP-VUE /” ：“/” ）
  ，
  路线，} ）; 导出默认路由器;

3.改造入口文件

//src/main.ts
import Vue from "vue";
import { createApp } from "vue";
import App from "./App.vue";
import router from "./router/router";
import { createRouter, createWebHashHistory } from "vue-router";

// let router;
let instance: Vue.App<Element>;

declare global {
  interface Window {
    __POWERED_BY_QIANKUN__?: string;
  }
}

interface IRenderProps {
  container: Element | string;
}

function render(props: IRenderProps) {
  const { container } = props;
  instance = createApp(App);
  instance
    .use(Antd)
    .use(router)
    .mount(
      container instanceof Element
        ? (container.querySelector("#app") as Element)
        : (container as string)
    );
}
// 独立运行时
if (!window.__POWERED_BY_QIANKUN__) {
  render({ container: "#app" });
}
//暴露主应用生命周期钩子
export async function bootstrap() {
  console.log("subapp bootstraped");
}

export async function mount(props: any) {
  console.log("mount subapp");
  render(props);
}

export async function unmount() {
  console.log("unmount college app");
  instance.unmount();
}

通过上面改造，打包之后，即可接入到主应用中

⚠️ 打包之后的项目没有入口 html 文件，因此你可以自己生成一个 index.html 在dist 目录中，也可以利用 @rollup/plugin-html 自动生成html并注入js 和css文件

还有一些细节要注意，因为 vite 的 tree shaking，在 vite 2.0 + 的版本中的 vite.config.ts ，在 rollupOptions. preserveEntrySignatures 设置为 strict。如果设置为 false 会无法正常工作。

按照您的方式进行了配置调整，构建代码是ok了，但是，主应用加载子应用的时候还是报错了。

错误内容如下：
Uncaught Error: application 'vite1' died in status LOADING_SOURCE_CODE: [qiankun] You need to export lifecycle functions in vite1 entry
at getLifecyclesFromExports (loader.js?6f14:220)
at _callee16$ (loader.js?6f14:320)
at tryCatch (runtime.js?96cf:63)
at Generator.invoke [as _invoke] (runtime.js?96cf:293)
at Generator.eval [as next] (runtime.js?96cf:118)
at fulfilled (tslib.es6.js?9ab4:71)

子应用代码如下：
https://gitee.com/jason_wangzhiwei/vite-app-sub

辛苦帮忙看一下吧

wangzhiwei1888 · 2021-05-10T03:25:26Z

下面是我使用 Vite2 vue3 微应用接入qiankun 方法

目前qiankun 官方还没有出 vue3 和vite 的接入方法，下面写一下我是如何把 vite2 + vue3 接入乾坤的

1.配置 `vite.config.ts`

把项目打包成 umd 格式的js 文件

const { name } = require("./package");
export default ()=>{
	return defineConfig({
    //...其他配置
    build: {
      target: "esnext",
      lib: {
        name: `${name}-[name]`,
        entry: path.resolve(__dirname, "src/main.ts"),
        formats: ["umd"],
      },
    },
  })
}

2.改造路由配置

// src/router/router.ts

///...其他代码
const router = createRouter({
  history: createWebHashHistory(
    window.__POWERED_BY_QIANKUN__ ? "/app-vue/" : "/"
  ),
  routes,
});
export default router;

3.改造入口文件

//src/main.ts
import Vue from "vue";
import { createApp } from "vue";
import App from "./App.vue";
import router from "./router/router";
import { createRouter, createWebHashHistory } from "vue-router";

// let router;
let instance: Vue.App<Element>;

declare global {
  interface Window {
    __POWERED_BY_QIANKUN__?: string;
  }
}

interface IRenderProps {
  container: Element | string;
}

function render(props: IRenderProps) {
  const { container } = props;
  instance = createApp(App);
  instance
    .use(Antd)
    .use(router)
    .mount(
      container instanceof Element
        ? (container.querySelector("#app") as Element)
        : (container as string)
    );
}
// 独立运行时
if (!window.__POWERED_BY_QIANKUN__) {
  render({ container: "#app" });
}
//暴露主应用生命周期钩子
export async function bootstrap() {
  console.log("subapp bootstraped");
}

export async function mount(props: any) {
  console.log("mount subapp");
  render(props);
}

export async function unmount() {
  console.log("unmount college app");
  instance.unmount();
}

通过上面改造，打包之后，即可接入到主应用中

⚠️ 打包之后的项目没有入口 html 文件，因此你可以自己生成一个 index.html 在dist 目录中，也可以利用 @rollup/plugin-html 自动生成html并注入js 和css文件

下面是我使用Vite2 vue3微应用接收qiankun方法

目前qiankun官方还没有出vue3和vite的接收方法，下面写一下我是如何把vite2 + vue3接入乾坤的

1.配置 `vite.config.ts`

把项目打包成umd格式的js文件

const  { name }  =  require （“ ./package” ）; 
出口 默认 （）=> {
	回报 defineConfig （{ 
    // ...其他配置
    编译：{
      目标：“esnext” ，
      LIB：{
        名称：` $ {名称} - [名]` ，
        项：路径。决心（__dirname ， “ src / main.ts” ）），
        格式：[ “ umd” ] ，
      } ，
    } ，
  } ）
}

2.改造路由配置

// src / router / router.ts

/// ...其他代码
常量 路由器 =  createRouter （{
  历史：createWebHashHistory （
    窗口。__POWERED_BY_QIANKUN__？“/ APP-VUE /” ：“/” ）
  ，
  路线，} ）; 导出默认路由器;

3.改造入口文件

//src/main.ts
import Vue from "vue";
import { createApp } from "vue";
import App from "./App.vue";
import router from "./router/router";
import { createRouter, createWebHashHistory } from "vue-router";

// let router;
let instance: Vue.App<Element>;

declare global {
  interface Window {
    __POWERED_BY_QIANKUN__?: string;
  }
}

interface IRenderProps {
  container: Element | string;
}

function render(props: IRenderProps) {
  const { container } = props;
  instance = createApp(App);
  instance
    .use(Antd)
    .use(router)
    .mount(
      container instanceof Element
        ? (container.querySelector("#app") as Element)
        : (container as string)
    );
}
// 独立运行时
if (!window.__POWERED_BY_QIANKUN__) {
  render({ container: "#app" });
}
//暴露主应用生命周期钩子
export async function bootstrap() {
  console.log("subapp bootstraped");
}

export async function mount(props: any) {
  console.log("mount subapp");
  render(props);
}

export async function unmount() {
  console.log("unmount college app");
  instance.unmount();
}

通过上面改造，打包之后，即可接入到主应用中

⚠️ 打包之后的项目没有入口 html 文件，因此你可以自己生成一个 index.html 在dist 目录中，也可以利用 @rollup/plugin-html 自动生成html并注入js 和css文件

还有一些细节要注意，因为 vite 的 tree shaking，在 vite 2.0 + 的版本中的 vite.config.ts ，在 rollupOptions. preserveEntrySignatures 设置为 strict。如果设置为 false 会无法正常工作。

按照您的方式进行了配置调整，构建代码是ok了，但是，主应用加载子应用的时候还是报错了。

错误内容如下：
Uncaught Error: application 'vite1' died in status LOADING_SOURCE_CODE: [qiankun] You need to export lifecycle functions in vite1 entry
at getLifecyclesFromExports (loader.js?6f14:220)
at _callee16$ (loader.js?6f14:320)
at tryCatch (runtime.js?96cf:63)
at Generator.invoke [as _invoke] (runtime.js?96cf:293)
at Generator.eval [as next] (runtime.js?96cf:118)
at fulfilled (tslib.es6.js?9ab4:71)

子应用代码如下：
https://gitee.com/jason_wangzhiwei/vite-app-sub

辛苦帮忙看一下吧

zengxiaohui2019 · 2021-05-14T06:40:46Z

@wangzhiwei1888 rollupOptions input 去掉否则打包的不是umd

LincWong · 2021-06-24T09:36:38Z

开发环境没法解决有点太可惜了

tengmaoqing · 2021-07-04T12:12:23Z

写了一个基于es打包的 vite插件 vite-plugin-qiankun

npm install vite-plugin-qiankun
配置简单、保留es特性

palluo · 2021-08-12T14:20:16Z

写了一个基于es打包的 vite插件 vite-plugin-qiankun

npm install vite-plugin-qiankun
配置简单、保留es特性

为啥我主应用如果是vite的话，就接入不了子应用的微前端呢？

liugangtaotie · 2021-08-24T01:29:19Z

写了一个基于es打包的 vite插件 vite-plugin-qiankun

npm install vite-plugin-qiankun
配置简单、保留es特性

为啥我主应用如果是vite的话，就接入不了子应用的微前端呢？

你可以参考我的这个项目：https:/liugangtaotie/qiankun-mobile-code

解决问题：qiankun 实战 demo，父应用 vue(vite)，子应用用 react(webpack) 和 vue(webpack)

wuyumengxiao · 2022-01-08T07:46:49Z

@wangzhiwei1888 rollupOptions input 去掉否则打包的不是umd

我去掉了，但是依旧报那个问题，请问还有可能是什么问题嘛

LincWong · 2022-01-08T07:47:14Z

你好，我已经收到你的邮件了。

manooog · 2022-04-07T04:07:38Z

增加rollup 配置后确实可以打包，但最终打包出的文件没有进行代码分割的，，，

LincWong · 2022-04-07T04:08:24Z

你好，我已经收到你的邮件了。

unliuxin · 2022-11-29T07:30:48Z

有试着打包上线吗，我打包出问题了

sky124380729 · 2023-02-01T09:49:06Z

mark

LincWong · 2023-02-01T09:49:26Z

你好，我已经收到你的邮件了。

wangjian27 · 2023-08-23T05:59:04Z

@wangzhiwei1888 我也是一样的问题，请问怎么解决的

LincWong · 2023-08-23T05:59:26Z

你好，我已经收到你的邮件了。

kgloveyou · 2024-09-10T03:26:16Z

下面是我使用 Vite2 vue3 微应用接入qiankun 方法

目前qiankun 官方还没有出 vue3 和vite 的接入方法，下面写一下我是如何把 vite2 + vue3 接入乾坤的

1.配置 `vite.config.ts`

把项目打包成 umd 格式的js 文件

const { name } = require("./package");
export default ()=>{
	return defineConfig({
    //...其他配置
    build: {
      target: "esnext",
      lib: {
        name: `${name}-[name]`,
        entry: path.resolve(__dirname, "src/main.ts"),
        formats: ["umd"],
      },
    },
  })
}

2.改造路由配置

// src/router/router.ts

///...其他代码
const router = createRouter({
  history: createWebHashHistory(
    window.__POWERED_BY_QIANKUN__ ? "/app-vue/" : "/"
  ),
  routes,
});
export default router;

3.改造入口文件

//src/main.ts
import Vue from "vue";
import { createApp } from "vue";
import App from "./App.vue";
import router from "./router/router";
import { createRouter, createWebHashHistory } from "vue-router";

// let router;
let instance: Vue.App<Element>;

declare global {
  interface Window {
    __POWERED_BY_QIANKUN__?: string;
  }
}

interface IRenderProps {
  container: Element | string;
}

function render(props: IRenderProps) {
  const { container } = props;
  instance = createApp(App);
  instance
    .use(Antd)
    .use(router)
    .mount(
      container instanceof Element
        ? (container.querySelector("#app") as Element)
        : (container as string)
    );
}
// 独立运行时
if (!window.__POWERED_BY_QIANKUN__) {
  render({ container: "#app" });
}
//暴露主应用生命周期钩子
export async function bootstrap() {
  console.log("subapp bootstraped");
}

export async function mount(props: any) {
  console.log("mount subapp");
  render(props);
}

export async function unmount() {
  console.log("unmount college app");
  instance.unmount();
}

通过上面改造，打包之后，即可接入到主应用中

⚠️ 打包之后的项目没有入口 html 文件，因此你可以自己生成一个 index.html 在dist 目录中，也可以利用 @rollup/plugin-html 自动生成html并注入js 和css文件

有没demo链接呢？

LincWong · 2024-09-10T03:26:48Z

你好，我已经收到你的邮件了。

gongshun added the duplicate This issue or pull request already exists label Feb 26, 2021

gongshun closed this as completed Feb 26, 2021

transtone mentioned this issue Apr 3, 2021

Could support third module with umd format? vitejs/vite#205

Closed

gongshun mentioned this issue May 17, 2021

想问一下，未来是否考虑支持 vite #1257

Open

wuyumengxiao mentioned this issue Jan 8, 2022

# 下面是我使用 Vite2 vue3 微应用接入qiankun 方法 #1918

Closed

[Feature Request] 后期可以在文档中加入基于vite的配置指导吗? #1268

[Feature Request] 后期可以在文档中加入基于vite的配置指导吗? #1268

Comments

uicheung commented Feb 19, 2021

Easy-Martin commented Feb 23, 2021

gongshun commented Feb 26, 2021

jpx5028254 commented Mar 2, 2021

faner11 commented Mar 23, 2021

xiaoxin-sky commented Mar 26, 2021

下面是我使用 Vite2 vue3 微应用 接入qiankun 方法

1.配置 vite.config.ts

2.改造路由配置

3.改造入口文件

通过上面改造，打包之后，即可接入到主应用中

jpx5028254 commented Mar 26, 2021 via email

xiaoxin-sky commented Mar 26, 2021 via email

transtone commented Apr 7, 2021 • edited Loading

David-C-gd-y commented Apr 22, 2021

下面是我使用Vite2 vue3微应用接收qiankun方法

1.配置 vite.config.ts

2.改造路由配置

3.改造入口文件

通过上面改造，打包之后，即可接入到主应用中

wangzhiwei1888 commented May 10, 2021

下面是我使用Vite2 vue3微应用接收qiankun方法

1.配置 vite.config.ts

2.改造路由配置

3.改造入口文件

通过上面改造，打包之后，即可接入到主应用中

wangzhiwei1888 commented May 10, 2021

下面是我使用 Vite2 vue3 微应用 接入qiankun 方法

1.配置 vite.config.ts

2.改造路由配置

3.改造入口文件

通过上面改造，打包之后，即可接入到主应用中

下面是我使用Vite2 vue3微应用接收qiankun方法

1.配置 vite.config.ts

2.改造路由配置

3.改造入口文件

通过上面改造，打包之后，即可接入到主应用中

zengxiaohui2019 commented May 14, 2021

LincWong commented Jun 24, 2021

tengmaoqing commented Jul 4, 2021

palluo commented Aug 12, 2021

liugangtaotie commented Aug 24, 2021

wuyumengxiao commented Jan 8, 2022

LincWong commented Jan 8, 2022 via email

manooog commented Apr 7, 2022

LincWong commented Apr 7, 2022 via email

unliuxin commented Nov 29, 2022

sky124380729 commented Feb 1, 2023

LincWong commented Feb 1, 2023 via email

wangjian27 commented Aug 23, 2023

LincWong commented Aug 23, 2023 via email

kgloveyou commented Sep 10, 2024

下面是我使用 Vite2 vue3 微应用 接入qiankun 方法

1.配置 vite.config.ts

2.改造路由配置

3.改造入口文件

通过上面改造，打包之后，即可接入到主应用中

LincWong commented Sep 10, 2024 via email

下面是我使用 Vite2 vue3 微应用接入qiankun 方法

1.配置 `vite.config.ts`

transtone commented Apr 7, 2021 •

edited

Loading

1.配置 `vite.config.ts`

1.配置 `vite.config.ts`

下面是我使用 Vite2 vue3 微应用接入qiankun 方法

1.配置 `vite.config.ts`

1.配置 `vite.config.ts`

下面是我使用 Vite2 vue3 微应用接入qiankun 方法

1.配置 `vite.config.ts`