v1.0.2 - add Github Pages configuration

This commit is contained in:
LINING-PC\lining
2025-07-02 13:28:23 +08:00
parent c590bea490
commit d93fbd23da
7 changed files with 135 additions and 1 deletions

View File

@@ -0,0 +1,59 @@
name: Deploy GitHub Pages
on:
push:
branches: [main, master]
pull_request:
branches: [main, master]
# Sets permissions of the GITHUB_TOKEN to allow deployment to GitHub Pages
permissions:
contents: read
pages: write
id-token: write
# Allow only one concurrent deployment, skipping runs queued between the run in-progress and latest queued.
# However, do NOT cancel in-progress runs as we want to allow these production deployments to complete.
concurrency:
group: 'pages'
cancel-in-progress: false
jobs:
# Build job
build:
runs-on: ubuntu-latest
steps:
- name: Checkout
uses: actions/checkout@v4
- name: Setup Node.js
uses: actions/setup-node@v4
with:
node-version: '18'
cache: 'npm'
- name: Install dependencies
run: npm ci
- name: Build demo
run: npm run build:pages
- name: Setup Pages
uses: actions/configure-pages@v4
- name: Upload artifact
uses: actions/upload-pages-artifact@v3
with:
path: './dist'
# Deployment job
deploy:
environment:
name: github-pages
url: ${{ steps.deployment.outputs.page_url }}
runs-on: ubuntu-latest
needs: build
steps:
- name: Deploy to GitHub Pages
id: deployment
uses: actions/deploy-pages@v4

View File

@@ -9,6 +9,12 @@
> Modern Vue 3 Gantt chart component library providing complete solutions for project management and task scheduling
## 🌐 Online Demo
🎯 **[Try Live Demo →](https://nelson820125.github.io/jordium-gantt-vue3/)**
*The online demo includes full feature showcase: task management, milestones, theme switching, internationalization, etc.*
## 🖼️ Demo Show
![Gantt Chart Overview](design/screenshots/demo.gif)

View File

@@ -10,6 +10,11 @@
> 现代化的 Vue 3 甘特图组件库,为项目管理和任务调度提供完整解决方案
## 🌐 在线体验
🎯 **[立即体验 Demo →](https://nelson820125.github.io/jordium-gantt-vue3/)**
*在线 Demo 包含完整功能展示:任务管理、里程碑、主题切换、国际化等*
## 🖼️ Demo展示

0
demo/public/.nojekyll Normal file
View File

61
docs/GITHUB-PAGES.md Normal file
View File

@@ -0,0 +1,61 @@
# GitHub Pages 部署指南
本项目已配置 GitHub Pages 自动部署,用户可以在线体验完整的 Gantt 图表功能。
## 🌐 在线访问
**Demo 地址**: https://nelson820125.github.io/jordium-gantt-vue3/
## 🔧 部署配置
### 自动化部署
项目使用 GitHub Actions 自动部署到 GitHub Pages
- **触发条件**: 推送到 `main``master` 分支
- **构建命令**: `npm run build:pages`
- **部署目录**: `./dist`
- **工作流文件**: `.github/workflows/deploy-github-pages.yml`
### 手动启用 GitHub Pages
1. 进入 GitHub 仓库设置页面
2. 找到 "Pages" 设置选项
3. 选择 "Source" 为 "GitHub Actions"
4. 推送代码到主分支,自动触发部署
## 📁 构建产物
- **开发构建**: `npm run build``dist/`
- **GitHub Pages**: `npm run build:pages``dist/` (包含正确的 base 路径)
- **NPM 包构建**: `npm run build:lib``npm-package/dist/`
## 🛠️ 本地预览
```bash
# 安装依赖
npm install
# 启动开发服务器
npm run dev
# 构建并预览生产版本
npm run build:pages
npm run preview
```
## 🔄 更新部署
每次推送到主分支时GitHub Actions 会自动:
1. 检出代码
2. 安装 Node.js 和依赖
3. 构建 demo 应用
4. 部署到 GitHub Pages
## 📝 注意事项
- 部署通常需要 1-5 分钟生效
- 确保 GitHub Pages 在仓库设置中已启用
- 自定义域名需要在 `demo/public/CNAME` 文件中配置
- 静态资源路径使用相对路径,确保在 Pages 环境中正常加载

View File

@@ -49,6 +49,7 @@
"dev:demo": "vite",
"build": "vue-tsc -b && vite build",
"build:demo": "vue-tsc -b && vite build",
"build:pages": "NODE_ENV=production vue-tsc -b && vite build",
"build:lib": "vite build --config vite.config.lib.ts",
"preview": "vite preview",
"lint": "eslint . --ext .vue,.js,.jsx,.cjs,.mjs,.ts,.tsx,.cts,.mts --fix",

View File

@@ -4,6 +4,8 @@ import vue from '@vitejs/plugin-vue'
// https://vite.dev/config/
export default defineConfig({
plugins: [vue()],
// GitHub Pages 部署时的 base 路径
base: process.env.NODE_ENV === 'production' ? '/jordium-gantt-vue3/' : '/',
// 开发服务器配置
root: 'demo',
// 构建配置