Skip to content

Commit

Permalink
🏄‍ feat: update readme (#8)
Browse files Browse the repository at this point in the history
  • Loading branch information
pdsuwwz authored Oct 1, 2023
1 parent 5dd146a commit 7003a96
Show file tree
Hide file tree
Showing 6 changed files with 21 additions and 97 deletions.
1 change: 0 additions & 1 deletion .eslintrc.js
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,6 @@ module.exports = {
browser: true,
node: true,
es2021: true,
jest: true,
'vue/setup-compiler-macros': true
},
parser: 'vue-eslint-parser',
Expand Down
65 changes: 20 additions & 45 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -5,86 +5,67 @@
[![thanks](https://badgen.net/badge/thanks/♥/pink)](https://github.com/pdsuwwz)
[![License](https://img.shields.io/github/license/pdsuwwz/vite-naive-template?color=blue)](https://github.com/pdsuwwz/vite-naive-template/blob/main/LICENSE)

🐳 Starter using NaiveUI + Vite 4 + Vue 3 + Pinia + TypeScript + i18n + Unplugin + UnoCSS to fast build a prototyping
🏄‍♂️ A Starter template built on Vite 4.x + Vue 3.3 + Naive UI + Pinia + UnoCSS + Unplugin Auto Import TypeScript.

一个适用国际化多语言(i18n)扩展、帮助你快速开发 B 端 ✈️✈️✈️ Vue3 + Vite4 + TS + Pinia 中小型后台管理系统的原型模板项目框架,集成 vue-i18n-next 💪


__[💻 Live Demo 在线体验](https://pdsuwwz.github.io/vite-naive-template/#/zh-hans)__


## 🌱 不同版本
目前一共有以下六个不同技术栈的仓库模板在持续维护,请尝试后选择适合自己的模板使用

### NaiveUI
(推荐基于在[当前仓库](https://github.com/pdsuwwz/naive-ts-starter/generate)基础上二次开发)
- 💚 (推荐1) [TS + Pinia + 🌐 低耦合(i18n)多语言 Vite4 + Vue3 + TS + UnoCSS + UnPlugin + NaiveUI + vue-i18n@next](https://github.com/pdsuwwz/naive-ts-starter)

### ElementPlus

- 💥 (推荐2) [TS + Pinia + 🌐 低耦合(i18n)多语言 Vite4 + Vue3 + TS + UnoCSS + UnPlugin + Element-Plus2 + vue-i18n@next](https://github.com/pdsuwwz/vue-boilerplate-i18n)

- ⚡️ TS + Pinia 版 [Vite4 + Vue3 + TS + Pinia + Element-Plus2 + useLocale + i18n](https://github.com/pdsuwwz/pinia-starter-ts)
- ⚡️ JS + Pinia 版 [Vite4 + Vue3 + Pinia + Element-Plus2 + useLocale + i18n](https://github.com/pdsuwwz/vite-pinia-starter)

- ⚡️ TS + Vuex4 版 [Vite4 + Vue3 + TS + Vuex4 + Element-Plus2 + useLocale + i18n](https://github.com/pdsuwwz/vite-ts-starter)
- ⚡️ JS + Vuex4 版 [Vite4 + Vue3 + Vuex4 + Element-Plus2 + useLocale + i18n](https://github.com/pdsuwwz/vite-starter)
一个简洁的 Vite 4 + Vue 3.3 + TypeScript 的 B 端后台原型 Naive UI 模板框架,内置 Pinia 模块化管理代码、路由鉴权、UnoCSS 暗黑模式、Unplugin 自动导入等, 开箱即用, 注重快速高效搭建实际业务场景, 持续更新最新技术栈 💪

[🔥 Live Demo 在线体验](https://pdsuwwz.github.io/vite-naive-template)


## 🎉 Features

* 支持 __Vite 4 + Vue 3 + TypeScript__
* UI 框架: __NaiveUI 2.x__
* Icons: 内置 __XIcons__\<IconFont \/> 组件, 可直接使用 IconFont 图标
* 支持 __Vite 4 + Vue 3.3 + TypeScript__
* UI 框架: __Naive UI 2.x__
* 状态管理: __Pinia__
* 基于 __UnoCSS__ 进行`暗黑模式`切换
* 单元测试框架: __Vitest__
* 内置 **UnoCSS + Unplugin**, 可实现样式内联、暗黑模式和组件按需自动导入, 提升开发效率
* 内置 __ESlint____Stylelint__, 可在此基础上扩充你想要的 Lint 配置规范
* 内置封装了一个**可能比较好用的** Axios , 需要时配合 Pinia Actions 一起食用
* 内置 **vue-i18n-next**, 支持到 VueRouter 路由级别切换语言,可编写国际化配置文件及扩展其他语言
* 封装了 \<IconFont \/> 组件, 可直接使用 IconFont 图标
* 内置全局 **window.$ModalXxxx** 插件, 支持使用 service 式地动态调用此插件来显示任意组件
* 路由鉴权已帮你封装好,同时配合 Nprogress, 只需要修改 permission.ts 文件即可
* 自带一个模块化的组件开发环境,可按照 Modules 目录解耦页面组件、路由组件、样式等文件
* 高度封装但不失灵活,内部抽象出了一个简单的业务流程供你参考(自由发挥),涉及三个核心页面:登录、列表和明细
* 自带一个模块化的组件开发环境,可按照 modules 目录解耦页面组件、路由组件、样式等文件
* 高度封装但不失灵活,内部抽象出了一个完整的业务流程供你参考,涉及三个核心页面:登录、列表和明细
* 节省你配置的时间,因此该项目的**轻量化**致使你只需要专心编写自己的业务代码即可


## Screenshot

<img width="1440" alt="image" src="https://user-images.githubusercontent.com/19891724/154831095-32a64eee-01ce-49be-ad64-626f0d276559.png">
<img width="1440" alt="image" src="https://user-images.githubusercontent.com/19891724/168773776-2d43c03d-54dd-4364-8830-0bba65603ef4.png">
<img width="1440" alt="image" src="https://user-images.githubusercontent.com/19891724/154829635-46de24db-e4c5-409f-9fa5-6a9770ace166.png">
<img width="1440" alt="image" src="https://user-images.githubusercontent.com/19891724/154829667-a84787b0-0104-4466-bb9e-9f586be66778.png">


## Environment Support

* Vue 3.2.x
* Vue 3.3
* Node >= 16.15.x

## Install

Run `pnpm i` to install the dependencies.
## Installation

Install node dependencies in all packages

```bash
pnpm i
pnpm install
```

## Run

Run `pnpm dev` to start the frontend dev server.
Local Development

```bash
pnpm dev
```

## Test

Unit Testing.
Unit Testing

```bash
pnpm test
```

Test code coverage.
Test code coverage

```bash
pnpm test:coverage
Expand All @@ -93,9 +74,3 @@ pnpm test:coverage
## 😎 Awesome

* [awesome-vite](https://github.com/pdsuwwz/awesome-vite)


## License

[MIT](./LICENSE) License | Copyright © 2020-PRESENT [Wisdom](https://github.com/pdsuwwz)

1 change: 0 additions & 1 deletion __tests__/hello.spec.ts
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,6 @@ import { expect, test } from 'vitest'
import { mount } from '@vue/test-utils'
import HelloWorld from '@/components/HelloWorld/index.vue'

// https://stackoverflow.com/questions/56398742/eslint-throws-no-undef-errors-when-linting-jest-test-files
test('displays message', () => {
const wrapper = mount(HelloWorld, {
props: {
Expand Down
6 changes: 0 additions & 6 deletions guide.md

This file was deleted.

44 changes: 0 additions & 44 deletions jest.config.js

This file was deleted.

1 change: 1 addition & 0 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -28,6 +28,7 @@
"vite",
"jest",
"vue3-jest",
"vitest",
"typescript",
"admin",
"example",
Expand Down

0 comments on commit 7003a96

Please sign in to comment.