timeago.js v4.0

回憶

2 年前，本身仍是基於 Python + bootstrap 開發一些內部平臺。由於涉及到須要使用 *** time ago 相似的時間顯示，因而用 Python 實現了一個方法 timeAgo，在服務端轉化好了以後給前端顯示。由於頁面國際化，因此內置有中英文兩種翻譯。

那個時候，ES6 推廣起來了，前端開發開始瘋狂使用 React、Vue、Angular 三大框架，前端能作的事情愈來愈多。React 用戶量陡增階段，咱們的一個平臺也嘗試使用 React，本身也開始初入前端，使用 Python 在服務端作 timeAgo 計算的最大問題在於沒法進行動態渲染，由於動態渲染仍是須要前端 js 配合。

因而，timeago.js** 出現了，將 Python 一套翻譯成 JavaScript，而後增長動態更新的機制。**

timeago.js is a tiny(2.0 kb) library used to format date with *** time ago statement.

這個項目是一個很 nano 的項目，打包出來，內置中英文翻譯也就 2 kb 不到。開源出去以後，幾回上 trending，star 竟然高達上千。

v4.0

從最開始的 1.0 版本到如今 的 4.0 版本，其實功能上區別不大，主要修改仍是在於代碼組織、API 設計、以及技術棧更新。

v4.0 從一年半前就開 issue 準備動工，可是由於工做緣由，週末徹底沒有寫業務代碼的動力。不過這一年多擴從了很多語言版本。

主要內容包括：

• 從 ES5 -> ES6 -> typescript
• 從單文件 -> webpack 打包 -> rollup
• 從 class API -> function API
• 移除 jQuery 支持
• 擴展 i18n 國際化
• 單測、覆蓋率

使用

快速開始

• 安裝

npm install timeago.js

• 引入

import { format, render, cancel, register } from 'timeago.js';
複製代碼

或者在 html 中以 script 標籤的方式引入，使用全局變量 timeago。

<script src="dist/timeago.min.js"></script>
複製代碼

• example

// format the time with locale
format('2016-06-12', 'en_US');
複製代碼

API

• format：格式化時間爲 time ago 格式靜態字符串，可用於 node 環境；
• render & cancel：頁面上動態渲染 dom 標籤；
• register：註冊自定義的語言 locale；

目前已經包含 46 個語言翻譯。更全面的使用文檔見：README.md。Live Demo：timeago.org。

這週末花了一天時間，整理出來終結 v4.0 版本，又能夠管兩年了。