ShinePCB - 专业PCB制造商官网

基于Vue 3 + Tailwind CSS + Element Plus + Vite构建的现代化PCB制造商官网。

技术栈

• Vue 3 - 渐进式JavaScript框架
• Vite - 下一代前端构建工具
• Tailwind CSS - 实用优先的CSS框架
• Element Plus - 基于Vue 3的组件库
• 自动导入 - Element Plus组件和API自动导入

快速开始

安装依赖

npm install

启动开发服务器

npm run dev

项目将在 http://localhost:3000 启动

构建生产版本

npm run build

预览生产构建

npm run preview

项目结构

shinepcb/
├── src/
│   ├── components/      # 页面组件
│   │   ├── Navbar.vue   # 导航栏
│   │   ├── CompanyIntroduction.vue  # 公司介绍
│   │   ├── ProductShowcase.vue      # 产品展示
│   │   └── ...          # 其他页面组件
│   ├── views/           # 视图页面
│   │   └── Home.vue     # 首页
│   ├── router/          # 路由配置
│   ├── stores/          # Pinia状态管理
│   ├── App.vue          # 主应用组件
│   ├── main.js          # 应用入口文件
│   └── style.css        # 全局样式文件
├── index.html           # HTML入口文件
├── package.json         # 项目依赖配置
├── vite.config.js       # Vite配置文件
├── tailwind.config.js   # Tailwind CSS配置
└── postcss.config.js    # PostCSS配置

功能特性

• ✅ Vue 3 Composition API
• ✅ Vite 热重载
• ✅ Tailwind CSS 实用类
• ✅ Element Plus 组件自动导入
• ✅ 响应式设计
• ✅ 现代化UI界面

开发说明

• Element Plus组件已配置自动导入，可直接在模板中使用
• Tailwind CSS类已全局可用
• 开发服务器默认端口为3000，可在vite.config.js中修改