timeago.js v4.0

回忆

2 年前,本身仍是基于 Python + bootstrap 开发一些内部平台。由于涉及到须要使用 *** time ago 相似的时间显示,因而用 Python 实现了一个方法 timeAgo,在服务端转化好了以后给前端显示。由于页面国际化,因此内置有中英文两种翻译。html

那个时候,ES6 推广起来了,前端开发开始疯狂使用 React、Vue、Angular 三大框架,前端能作的事情愈来愈多。React 用户量陡增阶段,咱们的一个平台也尝试使用 React,本身也开始初入前端,使用 Python 在服务端作 timeAgo 计算的最大问题在于没法进行动态渲染,由于动态渲染仍是须要前端 js 配合。前端

因而,timeago.js** 出现了,将 Python 一套翻译成 JavaScript,而后增长动态更新的机制。**node

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

image.png

这个项目是一个很 nano 的项目,打包出来,内置中英文翻译也就 2 kb 不到。开源出去以后,几回上 trending,star 竟然高达上千。git

v4.0

从最开始的 1.0 版本到如今 的 4.0 版本,其实功能上区别不大,主要修改仍是在于代码组织、API 设计、以及技术栈更新。github

v4.0 从一年半前就开 issue 准备动工,可是由于工做缘由,周末彻底没有写业务代码的动力。不过这一年多扩从了很多语言版本。web

主要内容包括:typescript

  • 从 ES5 -> ES6 -> typescript
  • 从单文件 -> webpack 打包 -> rollup
  • 从 class API -> function API
  • 移除 jQuery 支持
  • 扩展 i18n 国际化
  • 单测、覆盖率

使用

快速开始

  • 安装

npm install timeago.jsnpm

  • 引入
import { format, render, cancel, register } from 'timeago.js';
复制代码

或者在 html 中以 script 标签的方式引入,使用全局变量 timeagobootstrap

<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 版本,又能够管两年了。

相关文章
相关标签/搜索