1.初始化 Monorepo 项目

首先创建一个新的monorepo项目，并初始化一个 pnpm 工作空间。

1
2
3

mkdir my-monorepo
cd my-monorepo
pnpm init

准备项目

登录tf的gitlab地址找到自己这次要开发的项目仓库，基于master分支新建一个自己的开发分支。分支的命名规则如下：

• 功能开发： feature(feat)/时间-开发人员-功能 如：feature/20240929-gzx-equity
• 修复bug： fix/时间-开发人员-功能 如：fix/20240929-gzx-equity

新建分支并且检出到本地以后，就可以在这个分支上面进行开发了。

可维护性

在早期网站中，JavaScript主要用于实现一些小型动效或表单验证。今天的Web应用程序则动辄成千上万行JavaScript代码，用于完成各种各样的复杂处理。这些变化要求开发者把可维护能力放到重要位置上。

编写可维护的代码十分重要，因为大多数开发者会花大量时间去维护别人写的代码。实际开发中，从第一行代码开始写起的情况非常少，通常是要在别人的代码之上构建自己的工作。让自己的代码容易维护，可以保证其他开发者更好地完成自己的工作。

创建vue3项目（使用vite）

1.首先，在新的文件夹中初始化一个项目，使用Vite创建项目：

1

npm create vite@latest my-vue3-ts-tailwind-vite --template vue-ts

2.进入项目目录安装依赖

1
2

cd my-vue3-ts-tailwind-vite
npm install

3.接下来安装Tailwind CSS和相关工具：

1

npm install -D tailwindcss postcss autoprefixer

初始化 Tailwind CSS配置文件：

1

npx tailwindcss init -p

这样在根目录创建了tailwind.config.cjs和postcss.config.cjs两个文件。

最近因为工作需要，封装了一个大屏容器组件。

最近因为工作需要，封装了一个 3D 饼图组件。

最近因为工作需要，封装了一个多类型的柱状图组件。

最近因为工作需要，封装了一个百分比组件。

最近因为工作需要，封装了一个仪表盘组件。

最近因为工作需要，封装了一个折线图组件。