# 🛠️ 工具箱 - Toolbox

## 📦 安装

### 前置要求

- Node.js >= 16.0.0
- npm 或 yarn 或 pnpm

### 安装步骤

1. 克隆项目或下载源码

```bash
git clone <repository-url>
cd Toolbox
```

2. 安装依赖

```bash
npm install
# 或
yarn install
# 或
pnpm install
```

## 🚀 运行

### 开发模式

```bash
npm run dev
# 或
yarn dev
# 或
pnpm dev
```

开发服务器将在 `http://localhost:3000` 启动，并自动在浏览器中打开。

### 构建生产版本

```bash
npm run build
# 或
yarn build
# 或
pnpm build
```

构建产物将输出到 `dist` 目录。

### 预览生产构建

```bash
npm run preview
# 或
yarn preview
# 或
pnpm preview
```

## 📁 项目结构

```
Toolbox/
├── src/
│   ├── views/          # 页面组件
│   ├── router/         # 路由配置
│   │   └── index.js
│   ├── App.vue         # 根组件
│   ├── main.js         # 应用入口
│   └── style.css       # 全局样式
├── index.html          # HTML 模板
├── vite.config.js      # Vite 配置
├── package.json        # 项目配置
└── README.md          # 项目说明
```

## 🔧 添加新工具

要添加新的工具页面，只需：

1. 在 `src/views/` 目录下创建新的 Vue 组件
2. 在 `src/router/index.js` 中添加路由配置：

```javascript
{
  path: '/your-tool',
  name: 'YourTool',
  component: () => import('../views/YourTool.vue')
}
```

3. 在 `src/App.vue` 的导航栏中添加链接
4. 在 `src/views/Home.vue` 的 `tools` 数组中添加工具信息