Giter Club home page Giter Club logo

pdsuwwz / vite-naive-template Goto Github PK

View Code? Open in Web Editor NEW
22.0 2.0 4.0 10.75 MB

🏄‍♂️ 一个简洁的 NaiveUI + Vite + Vue3 + TSX + Pinia + UnoCSS + Unplugin + ESLint(v9) + Vitest 的 B 端后台 Admin 原型模板框架, 开箱即用, 内置模块化管理、Commit 规划检测 Husky + lint-staged 、路由鉴权、暗黑模式、Unplugin Auto 自动导入, 适合快速搭建和二次开发实际业务场景, 持续更新最新技术栈 🎊

Home Page: https://pdsuwwz.github.io/vite-naive-template/

License: MIT License

JavaScript 11.65% TypeScript 40.08% HTML 0.34% Vue 45.19% SCSS 2.75%
starter vitest vue vite vue3 naive pinia naiveui husky lint-staged

vite-naive-template's Introduction

vite-naive-template

Deploy GitHub Workflow Status (branch) thanks License

naive-ui vue vite

🏄‍♂️ A Starter template built on Vite 5.x + TypeScript + Vue 3.4 + Naive UI + Pinia + UnoCSS + Unplugin Auto Import.

一个简洁的 Vite5 + Vue3.4 + TypeScript 的 B 端后台原型 Naive UI 模板框架,内置 Pinia 模块化管理代码、路由鉴权、UnoCSS 暗黑模式、Unplugin 自动导入等, 开箱即用, 注重快速高效搭建实际业务场景, 持续更新最新技术栈 💪

🔥 Live Demo 在线体验

账号:[email protected] (随意邮箱)

密码:123456 (随意)

🪄 使用不同的 UI 库

如果更喜欢使用 Element Plus 2 作为 UI 库, 这里也为你提供了一个相应的模板项目:

🎉 Features

  • 支持 Vite 5 + Vue 3.4 + TypeScript
  • UI 框架: Naive UI 2.x
  • 状态管理: Pinia
  • 单元测试框架: Vitest
  • 内置 Unplugin Auto Import, 支持组件按需自动导入, 解放双手
  • 内置 UnoCSS + Iconify, 可实现原子化样式内联、图标按需自动导入, 提升开发效率
  • 内置 ESlintStylelint, 可在此基础上扩充你想要的 Lint 配置规范
  • 内置封装了一个可能比较好用的 Axios , 需要时配合 Pinia Actions 一起食用
  • 封装了 <IconFont /> 组件, 可直接使用 IconFont 图标
  • 服务式 service 挂载全局对象 window.$ModalXxxx 插件, 更方便的插件调用方式
  • 路由鉴权已帮你封装好,同时配合 Nprogress, 只需要修改 permission.ts 文件即可
  • 自带一个模块化的组件开发环境,可按照 modules 目录解耦页面组件、路由组件、样式等文件
  • 高度封装但不失灵活,内部抽象出了一个完整的业务流程供你参考,涉及三个核心页面:登录、列表和明细
  • 节省你配置的时间,因此该项目的轻量化致使你只需要专心编写自己的业务代码即可

Environment Support

  • Vue 3.4+
  • Node >= 16.15.x
  • VS Code 插件 dbaeumer.vscode-eslint >= v3.0.5 (pre-release)

Screenshot

image image

Installation

Install node dependencies in all packages

pnpm install

Run

Local Development

pnpm dev

Test

Unit Testing

pnpm test

Test code coverage

pnpm test:coverage

😎 Awesome

License

MIT License | Copyright © 2020-PRESENT Wisdom

vite-naive-template's People

Contributors

pdsuwwz avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.