# vite vue3 Ts 博客迭代

**Repository Path**: huajun912/vite-vue3-ts-blog-iteration

## Basic Information

- **Project Name**: vite vue3 Ts 博客迭代
- **Description**: ⚡ Vue 3, Vite 2, pnpm - born with fastness

- **Primary Language**: Unknown
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 1
- **Created**: 2024-01-18
- **Last Updated**: 2024-01-18

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

<div align='center'>
<h1>我的小破站 迭代 </h1>
</div>

## 特性

- ⚡  [Vue 3](https://github.com/vuejs/vue-next), [Vite 2](https://github.com/vitejs/vite), [pnpm](https://pnpm.js.org/) - 为速度而生
- 💪 [Typescript](https://www.typescriptlang.org/) - 强大的类型检查
- 🔥 使用 [新的 `<script setup>` 语法](https://github.com/vuejs/rfcs/pull/227)
- 🤙🏻 默认开启 [响应性语法糖](https://vuejs.org/guide/extras/reactivity-transform.html)
- 📦 [组件自动化加载](./src/components)
- 📥 [API 自动加载](https://github.com/antfu/unplugin-auto-import) - 直接使用 Composition API 无需引入
- 💡 [Vue Router v4](https://router.vuejs.org/zh/) - Vue 路由系统
- 🎨 [Tailwind CSS v3](https://tailwindcss.com/docs/configuration) - 快速建立现代网站，而不必离开 HTML。
- 🎉 [NProgress](https://github.com/rstacruz/nprogress) - 页面加载进度反馈
- 🍍 [使用 Pinia 的状态管理](https://pinia.esm.dev/)
- 🌼 [Daisy](https://daisyui.com/) - 开源的 Tailwind CSS 组件库
- 📜 [中文字体font-family常用预设]() 
- ☁️ 零配置部署 Netlify

### 集成 Tailwind 插件:

- [tailwindcss/forms](https://github.com/tailwindlabs/tailwindcss-forms)
- [tailwindcss/typography](https://tailwindcss.com/docs/typography-plugin)
- [tailwindcss/line-clamp](https://github.com/tailwindlabs/tailwindcss-line-clamp)
- [tailwindcss/aspect-ratio](https://github.com/tailwindlabs/tailwindcss-aspect-ratio)

### 编码风格

- [@kirklin/eslint-config](https://github.com/kirklin/eslint-config)

### 推荐的 IDE 设置

- [VSCode](https://code.visualstudio.com/)
- [Volar](https://marketplace.visualstudio.com/items?itemName=johnsoncodehk.volar)

### 性能
<img src='README.assets/ViteBoot-Lighthouse.png' alt='Vite-Boot Outstanding performance' width='1851'/>


## 项目结构

```
# vite-boot
├── LICENSE
├── README.assets
│   └── vite-vue-tailwind.png
├── README.md
├── README.zh-CN.md
├── index.html
├── node_modules
├── package.json
├── pnpm-lock.yaml
├── postcss.config.js        # tailwind 相关配置
├── public
│   └── favicon.ico
├── src
│   ├── App.vue              # 入口页面
│   ├── api                  # api 接口
│   ├── assets               # 静态资源
│   │   └── logo.png
│   ├── components           # 全局组件
│   │   └── Navbar.vue       # 顶部导航栏组件
│   ├── env.d.ts
│   ├── main.ts              # 入口文件
│   ├── router               # Vue router
│   │   └── index.ts
│   ├── settings.ts          # global configuration
│   ├── store                # Pinia 状态管理
│   │   ├── counter.ts
│   │   └── index.ts
│   ├── styles               # 全局样式
│   │   ├── main.scss
│   │   ├── nprogress.scss   # nprogress 样式（顶部加载样式）
│   │   ├── tailwind.css     # tailwind 样式
│   │   └── variables.scss   # SCSS全局变量
│   ├── utils                # 项目公共方法
│   │   └── darkMode.ts
│   └── views                # 所有页面
│       └── Index.vue        # APP首页
├── tailwind.config.js       # tailwind 配置文件
├── tsconfig.json            # TS 编译配置
└── vite.config.ts           # Vite 配置文件

```

## 进度

<img src='README.assets/Snipaste_2023-08-30_19-59-36.png' alt='Vite-Boot Outstanding performance' width='1851'/>