TimelineJS项目开发环境配置与部署指南

项目概述

TimelineJS是一个开源的时间轴可视化工具，允许用户通过简单的JSON数据创建交互式时间轴。本文将详细介绍如何搭建TimelineJS的开发环境以及相关的部署流程。

开发环境要求

在开始开发前，需要确保系统满足以下基础要求：

1. Python环境：需要Python 2.7.x版本
2. 虚拟环境工具：推荐使用virtualenvwrapper管理Python虚拟环境
3. Node.js环境：用于前端构建工具的运行
4. LESS预处理器：用于CSS预处理
5. UglifyJS：用于JavaScript代码压缩

安装LESS和UglifyJS可以通过npm命令完成：

npm install -g less
npm install -g uglify-js@">=2.4"

项目初始化与配置

1. 获取项目代码

首先需要获取项目代码仓库。建议将所有相关仓库放在同一父目录下管理。

2. 创建虚拟环境

使用virtualenvwrapper创建并激活专用虚拟环境：

mkvirtualenv TimelineJS
workon TimelineJS

3. 安装Python依赖

在虚拟环境中安装项目所需的Python依赖包：

pip install -r requirements.txt

4. 启动开发服务器

使用以下命令启动本地开发服务器：

fab serve

服务器默认运行在5000端口，可以通过浏览器访问http://localhost:5000查看效果。

5. 构建项目

在修改代码后，需要执行构建命令：

fab build

项目结构说明

• source目录：包含部署到CDN的资源文件
• website目录：项目网站相关文件
• config.json：构建、暂存和部署的配置文件

文档网站管理

本地预览文档修改

文档网站文件位于website目录下。运行fab serve命令后，可以通过http://localhost:5000预览修改效果。

部署文档更新

要将文档更新部署到生产环境，执行：

fab deploy

多语言支持扩展

为TimelineJS添加新语言支持需要以下步骤：

1. 在source/js/Core/Language/locale目录下添加对应语言文件，文件名使用ISO-639语言代码
2. 更新website/templates/_make.html文件，添加对新语言的引用（按语言名称字母顺序排列）
3. 创建测试时间轴验证新语言支持是否正常工作
4. 部署新版本（不要忘记执行stage_wp）
5. 更新相关插件中的语言支持文件

CDN部署流程

版本化部署

要将JavaScript变更部署到CDN的版本化目录：

1. 执行fab stage命令
2. 根据提示输入新版本号
3. 命令会自动构建项目并将文件复制到本地CDN仓库的版本化目录中
4. 最后会为当前提交打上版本标签

最新版本部署

要将特定版本设为CDN上的"latest"版本：

1. 确保已使用fab stage部署过该版本
2. 执行fab stage_latest命令
3. 根据提示输入要设为latest的版本号
4. 命令会从本地CDN仓库的对应版本目录复制文件到latest目录

注意：所有CDN变更需要单独推送和部署。目前还需要手动编辑索引页面。

最佳实践建议

1. 版本管理：遵循语义化版本控制规范，确保版本号更新合理
2. 测试验证：每次添加新语言或重大修改后，务必创建测试时间轴验证功能
3. 构建流程：在部署前确保执行完整的构建流程
4. 环境隔离：始终在专用虚拟环境中进行开发工作

通过本文介绍的配置和部署流程，开发者可以顺利搭建TimelineJS的开发环境并进行功能扩展与维护。