在经历了从Vue + Webpack到Vite + Ts的转变后,项目再一次进行了重构。
此次主要优化接口管理及前后端对接部分,对接口进行了统一管理。
此版本命名为Hikari——光。
以下为项目介绍。
- Vue3 + TypeScript + Less + Vue-Router + ESlint + Axios + Pinia
- Element-Plus 2.2.15 + ElementPlus-Icons
- moment / nprogress / qs
- 页面SFC存放于views文件夹内,组件存放于components。
- 接口url及请求相关方法放置于services文件夹内。不同环境通过VITE_APP_ENV识别。
VSCode + Volar (and disable Vetur) + TypeScript Vue Plugin (Volar).
TypeScript cannot handle type information for .vue
imports by default, so we replace the tsc
CLI with vue-tsc
for type checking. In editors, we need TypeScript Vue Plugin (Volar) to make the TypeScript language service aware of .vue
types.
If the standalone TypeScript plugin doesn't feel fast enough to you, Volar has also implemented a Take Over Mode that is more performant. You can enable it by the following steps:
- Disable the built-in TypeScript Extension
- Run
Extensions: Show Built-in Extensions
from VSCode's command palette - Find
TypeScript and JavaScript Language Features
, right click and selectDisable (Workspace)
- Run
- Reload the VSCode window by running
Developer: Reload Window
from the command palette.
See Vite Configuration Reference.
npm install
or pnpm install
npm run dev
or pnpm run dev
npm run build
or pnpm run build
Run Unit Tests with Vitest / 单元测试
npm run test:unit
or pnpm run test:unit
Lint with ESLint / 使用ESLint
npm run lint
or pnpm run lint