2025-05-27 14:55:54 +08:00
2025-05-27 14:55:54 +08:00
2025-05-27 14:55:54 +08:00
2025-05-27 14:55:54 +08:00
2025-05-27 14:55:54 +08:00
2025-05-27 14:55:54 +08:00
2025-05-27 14:55:54 +08:00
2025-05-27 14:55:54 +08:00
2025-05-27 14:55:54 +08:00
2025-05-27 14:55:54 +08:00
2025-05-27 14:55:54 +08:00
2025-05-27 14:55:54 +08:00
2025-05-27 14:55:54 +08:00
2025-05-27 14:55:54 +08:00
2025-05-27 14:55:54 +08:00
2025-05-27 14:55:54 +08:00
2025-05-27 14:55:54 +08:00
2025-05-27 14:55:54 +08:00
2025-05-27 14:55:54 +08:00
2025-05-27 14:55:54 +08:00

my-test

一个协同办公项目

安装

npm install

运行

npm run serve:test //本地运行,并且代理到测试环境
npm run serve:uat //本地运行,并且代理到预发布环境
npm run serve //本地运行,并且代理到生产环境

打包

// 测试环境
npm run build:test 

// 预发布环境
npm run build:uat 

// 生产环境
npm run build 

说明

项目采用vue3.0 + vite搭建,组件库默认引入了ant-design-vue,状态管理使用pinia。

常见问题

环境变量

环境变量放在env目录下,.env文件必定会加载,mode=test时,.env.test会加载,变量优先级,.env.test > .env ,因此,相同变量名,.env里的会被忽略。

按需引入组件

项目使用 unplugin-vue-components 插件,它可以自动引入组件,并按需引入组件的样式,无需手动引入样式。

import {
    Button
} from 'ant-design-vue';

引入函数组件的样式

ant-design-vue 中有个别组件是以函数的形式提供的,比如 message 组件。在使用函数组件时,unplugin-vue-components 无法自动引入对应的样式,因此需要手动引入样式。

import {
    message
} from 'ant-design-vue';
import 'ant-design-vue/es/message/style/css';

主题变量

主题变量在 src/styles/theme.json 中定义,项目跑起来后会注入到less,在less中通过 @ 变量名称使用,例如:background-color: @colorPrimary 。 主题变量同时也会注入到 中,具体可在该组件的 theme 属性配置,实现动态切换主题。

本地代理

运行项目时的接口代理,可在 vite.util.ts 的 proxyConfig 方法中配置。

相关文档

vue3.0 文档.
vite 文档.
Ant Design of Vue 文档.

S
Description
No description provided
Readme
153 KiB
0 Stars 1 Watchers 0 Forks
Languages
Vue 66.9%
TypeScript 22.7%
HTML 4.8%
JavaScript 3.1%
Less 2.5%