diff --git a/README.md b/README.md index fb0ca10..a7f9797 100644 --- a/README.md +++ b/README.md @@ -1,5 +1,102 @@ # Page Counter -无后端、快速部署、自持有数据的网页计数器 +[![](https://img.shields.io/badge/based-serverless-ff69b4.svg?style=popout-square)](https://github.com/dongyuanxin/page-counter) +[![](https://img.shields.io/badge/build-success-success.svg?style=popout-square)](https://github.com/dongyuanxin/page-counter) +[![](https://img.shields.io/badge/code_size-3kb-success.svg?style=popout-square)](https://github.com/dongyuanxin/page-counter) +[![](https://img.shields.io/badge/release-v1.1.0-blue.svg?style=popout-square)](https://github.com/dongyuanxin/page-counter/issues) +[![](https://img.shields.io/badge/license-MIT-blue.svg?style=popout-square)](https://github.com/dongyuanxin/page-counter) -加速开发中ing \ No newline at end of file + +基于 `Serverless` 开发的的**极简网页计数器**,支持基于 `Hexo`、`Jekyll`、`Octopress`、`ReactJS`、`VueJS` 等框架开发的博客、网站、中后台等**任何应用**。 + +## 特性 + +- 无后端快速部署 +- 源码精简,仅有3kb +- 支持 `npm` 和 `CDN` 引入 +- 数据持久化存储 +- 支持 `Leancloud` 平台 + +## 浏览器支持 + +| ![Chrome](https://raw.github.com/alrra/browser-logos/master/src/chrome/chrome_48x48.png) | ![Firefox](https://raw.github.com/alrra/browser-logos/master/src/firefox/firefox_48x48.png) | ![Safari](https://raw.github.com/alrra/browser-logos/master/src/safari/safari_48x48.png) | ![Opera](https://raw.github.com/alrra/browser-logos/master/src/opera/opera_48x48.png) | ![Edge](https://raw.github.com/alrra/browser-logos/master/src/edge/edge_48x48.png) | +| --- | --- | --- | --- | --- | +| Latest ✔ | Latest ✔ | Latest ✔ | Latest ✔ | Latest ✔ | + +## 安装 + +### 方法一:`CDN` + +请将以下代码复制到 `` 标签的前面: + +```html + + + +``` + +### 方法二:`npm` + +安装: + +```sh +npm install --save page-counter +# 或者: yarn add page-counter +``` + +设置全局环境变量: + +```javascript +window.PAGE_COUNTER_CONFIG = { + leancloud: { + table: '存放记录的表格', + appId: 'leancloud应用的appId', + appKey: 'leancloud应用的appKey' + } +} +``` + +## 使用 + +总浏览量和当前页面浏览量会分别放在ID为 `page-counter-total-times` 和 `page-counter-single-times` 的DOM元素中 + +### 方法一:`CDN` 引入 + +```html +
+ 网站总浏览量 +
+
+ 当前页面浏览量 +
+``` + +### 方法二:`npm` 引入 + +```javascript +import PageCounter from page-counter + +PageCounter.setData() // 统计当前页面 + +PageCounter.countTotal() // 总浏览量自动放入ID为 page-counter-total-times 的DOM元素中 + +PageCounter.countSingle() // 总浏览量自动放入ID为 page-counter-single-times 的DOM元素中 +``` + +## Todolist + +- [ ] 支持更多地 `Serverless` 平台,包括但不限于小程序云开发、bmob等 +- [ ] 一键备份命令,优化线上空间,本地持久化数据 +- [ ] 更详细的使用和 `code` 文档 + +## Idea + +Welcome to [Issues](https://github.com/dongyuanxin/page-counter/issues) \ No newline at end of file diff --git a/package.json b/package.json index fc36820..6c2b25d 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "page-counter", - "version": "1.0.0", + "version": "1.1.0", "description": "", "main": "index.js", "scripts": {