Vue 3 + Vite

project
├── .env.development          # 环境变量配置文件，用于在开发环境
├── .env.production           # 环境变量配置文件，用于在生产环境
├── Dockerfile                # 用于构建Docker镜像
├── nginx.conf                # Nginx配置文件，用于dockerfile时替换自定义配置
├── package.json              # 用于管理项目依赖和脚本的文件，包含了项目的基本信息和依赖项列表
├── README.md                 # 项目的说明文档
├── src
│   ├── main.js               # Vue.js应用程序的入口文件
│   ├── App.vue               # Vue.js应用程序的根组件，包含了应用程序的整体布局,全局样式和逻辑
│   ├── api                   # 定义使用axios库进行网络请求的文件
│   ├── assets                # 存放静态资源文件，如图片、字体等
│   ├── components            # 存放通用组件的封装，可以在各个页面中被引用
│   ├── icons                 # 存放SVG矢量图片文件
│   ├── router                # 存放Vue-Router路由配置文件
│   ├── store                 # 存放Vuex的状态管理文件，用于管理应用程序的状态
│   ├── styles                # 存放全局CSS样式文件
│   ├── utils                 # 存放工具类文件，可以在应用程序中使用
│   └── views                 # 存放前端页面文件
│       ├── login             # 存放登录页相关文件
│       ├── dashboard         # 存放首页相关文件
│       └── layout            # 存放通用页面加载框架，显示通用的页面布局
└── ...                       # 其他文件和目录

# 安装vue3
npm install -g @vue/cli # 全局安装vue
vue create .   # 在当前目录建立项目; use PNPM Or NPM

# 将相关依赖安装在当前目录
npm install
# 运行本地开发环境 OR npm run dev
npm run serve
# 编译构建静态资源
npm run build
# 检查/修复文件
npm run lint

# 使用yarn管理依赖
npm install -g yarn
yarn
yarn add less-loader

# 使用pnpm方式
# 安装依赖
pnpm install
# 运行项目
pnpm dev

# 查看tag
git tag

# 创建分支
git branch dev-layout-demo
git checkout dev-layout-demo

# 查看当前所在分支
git branch

# 删除分支
git branch -d vue-layout-dev

# 合并分支
git checkout main
git merge dev-layout-demo

# 推送分支或tag到远程仓库
git add .
git commit -m 'init'
git push origin dev-layout-demo

docker build -f Dockerfile -t ui-base:test  .
docker run -p80:80 --rm ui-base:test