Vue3+Vite+TS：多入口项目搭建（简单版）

当多个系统平台想要共享公共组件等资源，而彼此之间基本没有业务关联，此时可以配置多入口应用，将多个系统平台代码放在同一个代码仓库管理。

创建项目

# npm create vite@latest 项目名
npm create vite@latest multi-entry-demo
1
2

选择vue，回车
选择vue框架
选择vue-ts，回车

按照指示操作
安装依赖并运行
项目目录如下

多页面配置

删除无用文件

删除项目根目录下src目录中除vite-env.d.ts文件外的所有文件，以及项目根目录下index.hml文件。
删除冗余文件

创建多个项目目录

在项目根目录下src目录中创建packages目录（统一管理多个入口文件）。
在packages目录下创建app1目录，并在其中创建App.vue、index.html及main.ts文件。


<template>
  <router-view />
template>

<script setup lang="ts">script>
1
2
3
4
5
6


DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>app1title>
head>
<body>
  <div id="app">div>
  <script type=1
2
3
4
5
6
7
8
9
10
11

相关阅读:
Feign远程调用
NIO 基础总结
Javascript 教程
Python最佳实践-构建自己的第三方库
解决Antd 二次封装表格的可编辑功能(editable table)不生效的问题
华为OD 走方格的方案数（100分）【java】A卷+B卷
MySQL索引事务存储引擎
计算机网络
SYS——汽车零部件从项目到软件开发过程
【知识蒸馏】使用CoatNet蒸馏ResNet图像分类模型

原文地址：https://blog.csdn.net/qq_44419617/article/details/126642722