feat: close #19, support vue plugin (#21)

* refactor: rename ERROR_MSG -> ERROR_MSGS, add tsconfig.json * style: quick-start -> guide, fix some eslint error, add some emoji
tuax · Feb 21, 2019 · c792086 · c792086
1 parent 54b0ea9
commit c792086
Show file tree

Hide file tree

Showing 25 changed files with 294 additions and 165 deletions.
diff --git a/README.md b/README.md
@@ -1,18 +1,26 @@
 <h1 align="center">tua-storage</h1>
 
-<h5 align="center">
-    让我们构建大一统的缓存层~
-</h5>
+<h4 align="center">让我们构建大一统的缓存层~</h4>
 
 <p align="center">
     <a href="https://tuateam.github.io/tua-storage/">👉完整文档地址点这里👈</a>
 </p>
 
 <p align="center">
-    <a href="https://circleci.com/gh/tuateam/tua-storage/tree/master"><img src="https://img.shields.io/circleci/project/github/tuateam/tua-storage/master.svg" alt="Build Status"></a>
-    <a href="https://codecov.io/github/tuateam/tua-storage?branch=master"><img src="https://img.shields.io/codecov/c/github/tuateam/tua-storage/master.svg" alt="Coverage Status"></a>
-    <a href="https://www.npmjs.com/package/tua-storage"><img src="https://img.shields.io/npm/v/tua-storage.svg" alt="Version"></a>
-    <a href="https://www.npmjs.com/package/tua-storage"><img src="https://img.shields.io/npm/l/tua-storage.svg" alt="License"></a>
+    <a href="https://circleci.com/gh/tuateam/tua-storage/tree/master" target="_blank">
+        <img src="https://img.shields.io/circleci/project/github/tuateam/tua-storage/master.svg" alt="Build Status">
+    </a>
+    <a href="https://codecov.io/github/tuateam/tua-storage?branch=master" target="_blank">
+        <img src="https://img.shields.io/codecov/c/github/tuateam/tua-storage/master.svg" alt="Coverage Status">
+    </a>
+    <a href="https://david-dm.org/tuateam/tua-storage" target="_blank">
+        <img src="https://david-dm.org/tuateam/tua-storage.svg" alt="dependencies">
+    </a>
+    <a href="https://www.npmjs.com/package/tua-storage" target="_blank">
+        <img src="https://badgen.net/npm/dm/tua-storage" alt="Downloads per month">
+        <img src="https://img.shields.io/npm/v/tua-storage.svg" alt="Version">
+        <img src="https://img.shields.io/npm/l/tua-storage.svg" alt="License">
+    </a>
 </p>
 
 ## 安装
@@ -48,7 +56,7 @@ $ yarn add tua-storage
 由于异步方法没法变成同步方法，所以以上方法在所有场景下都异步返回 `Promise`。
 
 ## 如何使用？
-首先参阅文档 [安装](https://tuateam.github.io/tua-storage/quick-start/installation.html) 将 `tua-storage` 安装到你的项目中，并正确地导入和初始化。
+首先参阅文档 [安装](https://tuateam.github.io/tua-storage/guide/installation.html) 将 `tua-storage` 安装到你的项目中，并正确地导入和初始化。
 
 ### 常规操作
 对于存储层来说，最基本的操作自然是保存（save）、读取（load）、删除（remove，删除单个）和清除（clear，清空全部）了。

diff --git a/babel.config.js b/babel.config.js
@@ -14,12 +14,12 @@ module.exports = {
                 ],
             ],
         },
-        'prod': {
+        'production': {
             'presets': [
                 [
                     '@babel/preset-env',
                     { 'modules': false },
-                ]
+                ],
             ],
             'plugins': [
                 [

diff --git a/commitlint.config.js b/commitlint.config.js
@@ -1,6 +1,6 @@
 module.exports = {
     // https://www.npmjs.com/package/@commitlint/config-conventional
     extends: ['@commitlint/config-conventional'],
-    "rules": {
+    rules: {
     },
 }
diff --git a/docs/.vuepress/config.js b/docs/.vuepress/config.js
@@ -1,54 +1,58 @@
+const { name } = require('../../package.json')
+
+const description = '📦统一封装各个端（小程序、web 端、React-Native、Node 端）中对于缓存层的使用'
+
 module.exports = {
-    base: '/tua-storage/',
+    base: '/' + name + '/',
     locales: {
-        '/': {
-            title: 'tua-storage',
-            description: '📦统一封装各个端（小程序、web 端、React-Native、Node 端）中对于缓存层的使用'
-        }
+        '/': { title: name, description },
     },
     head: [
         ['link', { rel: 'icon', href: `/logo.png` }],
     ],
+    evergreen: true,
     serviceWorker: true,
     themeConfig: {
         repo: 'tuateam/tua-storage',
         docsDir: 'docs',
         editLinks: true,
-        editLinkText: '在 GitHub 上编辑此页',
         lastUpdated: '上次更新',
+        sidebarDepth: 2,
+        editLinkText: '在 GitHub 上编辑此页',
         nav: [
             {
-                text: '快速上手',
-                link: '/quick-start/',
+                text: '🌱指南',
+                link: '/guide/',
             },
             {
-                text: '配置和方法',
+                text: '⚙️配置和方法',
                 link: '/config-methods/',
             },
             {
-                text: '生态系统',
+                text: '🔥生态系统',
                 items: [
-                    { text: 'api 生成工具', link: 'https://tuateam.github.io/tua-api/' },
-                    { text: '小程序框架', link: 'https://tuateam.github.io/tua-mp/' },
+                    { text: '🏗api 生成工具', link: 'https://tuateam.github.io/tua-api/' },
+                    { text: '🖖小程序框架', link: 'https://tuateam.github.io/tua-mp/' },
                 ],
             },
         ],
         sidebar: {
-            '/quick-start/': [
+            '/guide/': [
                 {
-                    title: '快速上手',
+                    title: '🌱指南',
                     collapsable: false,
                     children: [
                         'installation',
                         '',
                         'sync-data',
+                        'vue-plugin',
                         '../config-methods/',
                     ],
                 },
             ],
             '/config-methods/': [
                 {
-                    title: '配置和方法',
+                    title: '⚙️配置和方法',
                     collapsable: false,
                     children: [
                         '',
@@ -60,8 +64,8 @@ module.exports = {
         },
         serviceWorker: {
             updatePopup: {
-               message: 'New content is available.',
-               buttonText: 'Refresh',
+                message: 'New content is available.',
+                buttonText: 'Refresh',
             },
         },
     },

diff --git a/docs/README.md b/docs/README.md
@@ -1,7 +1,7 @@
 ---
 home: true
 actionText: 快速上手 →
-actionLink: /quick-start/
+actionLink: /guide/
 features:
 - title: 多端统一 api
   details: 支持 web 端、小程序端、React-Native、Node.js 端。
@@ -18,18 +18,25 @@ features:
 footer: MIT Licensed | Copyright © 2018-present StEve Young
 ---
 
-<h4 align="center">
-    让我们构建大一统的缓存层~
-</h4>
+<h4 align="center">让我们构建大一统的缓存层~</h4>
 
 <p align="center">
     <a href="https://github.com/feross/standard"><img :src="$withBase('/standard.svg')" alt="Standard - JavaScript Style"></a>
 </p>
 
 <p align="center">
-    <a href="https://circleci.com/gh/tuateam/tua-storage/tree/master"><img src="https://img.shields.io/circleci/project/github/tuateam/tua-storage/master.svg" alt="Build Status"></a>
-    <a href="https://codecov.io/github/tuateam/tua-storage?branch=master"><img src="https://img.shields.io/codecov/c/github/tuateam/tua-storage/master.svg" alt="Coverage Status"></a>
-    <a href="https://www.npmjs.com/package/tua-storage"><img src="https://img.shields.io/npm/v/tua-storage.svg" alt="Version"></a>
-    <a href="https://www.npmjs.com/package/tua-storage"><img src="https://img.shields.io/npm/l/tua-storage.svg" alt="License"></a>
-    <img src="https://img.shields.io/badge/dependencies-none-green.svg" alt="dependencies">
+    <a href="https://circleci.com/gh/tuateam/tua-storage/tree/master" target="_blank">
+        <img src="https://img.shields.io/circleci/project/github/tuateam/tua-storage/master.svg" alt="Build Status">
+    </a>
+    <a href="https://codecov.io/github/tuateam/tua-storage?branch=master" target="_blank">
+        <img src="https://img.shields.io/codecov/c/github/tuateam/tua-storage/master.svg" alt="Coverage Status">
+    </a>
+    <a href="https://david-dm.org/tuateam/tua-storage" target="_blank">
+        <img src="https://david-dm.org/tuateam/tua-storage.svg" alt="dependencies">
+    </a>
+    <a href="https://www.npmjs.com/package/tua-storage" target="_blank">
+        <img src="https://badgen.net/npm/dm/tua-storage" alt="Downloads per month">
+        <img src="https://img.shields.io/npm/v/tua-storage.svg" alt="Version">
+        <img src="https://img.shields.io/npm/l/tua-storage.svg" alt="License">
+    </a>
 </p>
diff --git a/docs/config-methods/methods.md b/docs/config-methods/methods.md
@@ -156,7 +156,7 @@ async () => {
 * 默认值：`undefined` 或是初始化时 `syncFnMap` 中的对应函数
 
 ::: tip
-当数据不存在或已过期时，调用同步函数进行数据同步。详细使用方法请参阅 [数据同步](../quick-start/sync-data.md) 章节。
+当数据不存在或已过期时，调用同步函数进行数据同步。详细使用方法请参阅 [数据同步](../guide/sync-data.md) 章节。
 :::
 
 ### syncParams 同步参数对象

diff --git a/docs/quick-start/README.md → docs/guide/README.md b/docs/quick-start/README.md → docs/guide/README.md
diff --git a/docs/quick-start/installation.md → docs/guide/installation.md b/docs/quick-start/installation.md → docs/guide/installation.md
diff --git a/docs/quick-start/sync-data.md → docs/guide/sync-data.md b/docs/quick-start/sync-data.md → docs/guide/sync-data.md
diff --git a/docs/guide/vue-plugin.md b/docs/guide/vue-plugin.md
@@ -0,0 +1,35 @@
+# 在 Vue 中使用 tua-storage
+## 代码示例
+
+```js
+import Vue from 'vue'
+import TuaStorage from 'tua-storage'
+
+Vue.use(TuaStorage, {
+    storageEngine: window.localStorage,
+    // other options
+})
+```
+
+之后在组件中通过 `this.$tuaStorage` 即可获取实例。
+
+```vue
+<template>...</template>
+
+<script>
+export default {
+    methods: {
+        async fetchData () {
+            try {
+                const data = await this.$tuaStorage.load({ ... })
+                console.log('data', data)
+            } catch (e) {
+                console.error(e)
+            }
+        },
+    },
+}
+</script>
+
+<style>...</style>
+```
diff --git a/package.json b/package.json
@@ -1,35 +1,39 @@
 {
     "name": "tua-storage",
-    "version": "1.5.2",
-    "main": "dist/TuaStorage.umd.js",
-    "module": "dist/TuaStorage.es.js",
-    "jsnext:main": "dist/TuaStorage.es.js",
-    "description": "A common storage for web(localStorage), for RN(AsyncStorage), for mini-program(wx) or just memory cache(Node.js)",
+    "version": "1.6.0",
+    "description": "🏗 A common storage for web(localStorage), for RN(AsyncStorage), for mini-program(wx) or just memory cache(Node.js)",
+    "main": "dist/TuaStorage.cjs.js",
+    "module": "dist/TuaStorage.esm.js",
+    "unpkg": "dist/TuaStorage.umd.js",
+    "jsdelivr": "dist/TuaStorage.umd.js",
     "files": [
         "src/",
         "dist/"
     ],
     "scripts": {
-        "docs": "vuepress dev docs -h localhost",
-        "docs:build": "vuepress build docs",
         "cov": "open coverage/lcov-report/index.html",
-        "tdd": "cross-env NODE_ENV=test jest --watch",
-        "test": "cross-env NODE_ENV=test jest && codecov",
-        "lint": "eslint --fix src/ test/",
-        "deploy": "yarn docs:build && gh-pages -m \"[ci skip]\" -d docs/.vuepress/dist",
+        "docs": "vuepress dev docs",
+        "docs:build": "vuepress build docs",
+        "lint": "eslint --fix . docs/.vuepress/ --ignore-path .gitignore",
+        "test": "cross-env NODE_ENV=test jest",
+        "test:tdd": "cross-env NODE_ENV=test jest --watch",
         "prebuild": "rimraf dist/* & npm run test",
-        "build": "cross-env NODE_ENV=prod rollup -c",
-        "pub": "npm run build && npm publish"
+        "build": "cross-env NODE_ENV=production rollup -c",
+        "deploy": "npm run docs:build && gh-pages -m \"[ci skip]\" -d docs/.vuepress/dist",
+        "next:pm": "npm --no-git-tag-version version preminor",
+        "next:pr": "npm --no-git-tag-version version prerelease",
+        "pub": "npm run build && npm publish",
+        "pub:n": "npm run build && npm publish --tag next"
     },
     "husky": {
         "hooks": {
-            "pre-push": "lint-staged",
+            "pre-push": "npm test",
             "pre-commit": "lint-staged",
             "commit-msg": "commitlint -E HUSKY_GIT_PARAMS"
         }
     },
     "lint-staged": {
-        "src/**/*.js": [
+        "{src,test}/**/*.js": [
             "eslint --fix",
             "git add"
         ]
@@ -41,6 +45,10 @@
         "transform": {
             "^.+\\.js$": "babel-jest"
         },
+        "moduleNameMapper": {
+            "@/(.*)$": "<rootDir>/src/$1",
+            "@examples/(.*)$": "<rootDir>/examples/$1"
+        },
         "collectCoverage": true,
         "collectCoverageFrom": [
             "src/**"
@@ -56,51 +64,52 @@
         "type": "git",
         "url": "git+https://github.com/tuateam/tua-storage.git"
     },
-    "keywords": [
-        "tua-storage",
-        "storage",
-        "wx",
-        "miniprogram",
-        "wxmp",
-        "weapp"
-    ],
-    "author": "StEve Young",
-    "license": "MIT",
     "bugs": {
         "url": "https://github.com/tuateam/tua-storage/issues"
     },
-    "homepage": "https://github.com/tuateam/tua-storage#readme",
+    "homepage": "https://tuateam.github.io/tua-storage/",
     "devDependencies": {
-        "@babel/core": "^7.0.0",
-        "@babel/plugin-external-helpers": "^7.0.0",
-        "@babel/plugin-proposal-decorators": "^7.0.0",
-        "@babel/plugin-proposal-object-rest-spread": "^7.0.0",
-        "@babel/preset-env": "^7.2.0",
-        "@commitlint/cli": "^7.2.1",
-        "@commitlint/config-conventional": "^7.1.2",
+        "@babel/core": "^7.3.3",
+        "@babel/plugin-external-helpers": "^7.2.0",
+        "@babel/plugin-proposal-decorators": "^7.3.0",
+        "@babel/plugin-proposal-object-rest-spread": "^7.3.2",
+        "@babel/preset-env": "^7.3.1",
+        "@commitlint/cli": "^7.5.2",
+        "@commitlint/config-conventional": "^7.5.0",
+        "@vue/test-utils": "^1.0.0-beta.29",
         "babel-core": "^7.0.0-bridge.0",
         "babel-eslint": "^10.0.1",
         "babel-jest": "^24.1.0",
-        "codecov": "^3.1.0",
+        "codecov": "^3.2.0",
         "cross-env": "^5.2.0",
-        "eslint": "^5.9.0",
+        "eslint": "^5.14.1",
         "eslint-config-standard": "^12.0.0",
-        "eslint-plugin-import": "^2.14.0",
-        "eslint-plugin-node": "^8.0.0",
+        "eslint-plugin-import": "^2.16.0",
+        "eslint-plugin-node": "^8.0.1",
         "eslint-plugin-promise": "^4.0.1",
         "eslint-plugin-standard": "^4.0.0",
         "gh-pages": "^2.0.1",
-        "husky": "^1.2.0",
+        "husky": "^1.3.1",
         "jest": "^24.1.0",
-        "jest-localstorage-mock": "^2.3.0",
-        "lint-staged": "^8.1.0",
+        "jest-localstorage-mock": "^2.4.0",
+        "lint-staged": "^8.1.4",
         "mock-async-storage": "^2.0.4",
-        "rimraf": "^2.6.2",
-        "rollup": "^1.1.2",
-        "rollup-plugin-babel": "^4.0.3",
+        "rimraf": "^2.6.3",
+        "rollup": "^1.2.2",
+        "rollup-plugin-babel": "^4.3.2",
         "rollup-plugin-eslint": "^5.0.0",
         "rollup-plugin-json": "^3.1.0",
-        "rollup-plugin-uglify": "^6.0.0",
-        "vuepress": "^0.14.8"
-    }
+        "rollup-plugin-uglify": "^6.0.2",
+        "vuepress": "^1.0.0-alpha.39"
+    },
+    "keywords": [
+        "tua-storage",
+        "storage",
+        "wx",
+        "miniprogram",
+        "wxmp",
+        "weapp"
+    ],
+    "author": "StEve Young",
+    "license": "MIT"
 }