@logto/vue 0.1.15 → 0.1.18
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +109 -0
- package/lib/plugin.d.ts +5 -1
- package/package.json +3 -4
package/README.md
ADDED
|
@@ -0,0 +1,109 @@
|
|
|
1
|
+
# Logto Vue SDK
|
|
2
|
+
[](https://www.npmjs.com/package/@logto/vue)
|
|
3
|
+
[](https://github.com/logto-io/js/actions/workflows/main.yml)
|
|
4
|
+
[](https://app.codecov.io/gh/logto-io/js?branch=master)
|
|
5
|
+
|
|
6
|
+
The Logto Vue SDK written in TypeScript. Check out our [integration guide](https://docs.logto.io/integrate-sdk/vue) or [docs](https://docs.logto.io/sdk/vue) for more information.
|
|
7
|
+
|
|
8
|
+
We also provide [集成指南](https://docs.logto.io/zh-cn/integrate-sdk/vue) and [文档](https://docs.logto.io/zh-cn/sdk/vue) in Simplified Chinese.
|
|
9
|
+
|
|
10
|
+
## Installation
|
|
11
|
+
|
|
12
|
+
### Using npm
|
|
13
|
+
|
|
14
|
+
```bash
|
|
15
|
+
npm install @logto/vue
|
|
16
|
+
```
|
|
17
|
+
|
|
18
|
+
### Using yarn
|
|
19
|
+
|
|
20
|
+
```bash
|
|
21
|
+
yarn add @logto/vue
|
|
22
|
+
```
|
|
23
|
+
|
|
24
|
+
### Using pnpm
|
|
25
|
+
|
|
26
|
+
```bash
|
|
27
|
+
pnpm install @logto/vue
|
|
28
|
+
```
|
|
29
|
+
|
|
30
|
+
### Using CDN
|
|
31
|
+
|
|
32
|
+
```bash
|
|
33
|
+
<script src="https://logto.io/js/logto-sdk-vue/0.1.0/logto-sdk-vue.production.js" />
|
|
34
|
+
```
|
|
35
|
+
|
|
36
|
+
## Get Started
|
|
37
|
+
|
|
38
|
+
A sample project with the following code snippets can be found at [Vue Sample](https://github.com/logto-io/js/tree/master/packages/vue-sample)
|
|
39
|
+
|
|
40
|
+
Check out the source code and try it yourself. (We use [pnpm](https://pnpm.io/) for package management)
|
|
41
|
+
|
|
42
|
+
```bash
|
|
43
|
+
pnpm i && pnpm start
|
|
44
|
+
```
|
|
45
|
+
|
|
46
|
+
### Import Logto Vue plugin
|
|
47
|
+
|
|
48
|
+
```ts
|
|
49
|
+
import { createLogto, LogtoConfig } from '@logto/vue';
|
|
50
|
+
|
|
51
|
+
const config: LogtoConfig = {
|
|
52
|
+
appId: '<your-application-id>',
|
|
53
|
+
endpoint: '<your-logto-endpoint>'
|
|
54
|
+
};
|
|
55
|
+
|
|
56
|
+
const app = createApp(App);
|
|
57
|
+
|
|
58
|
+
app.use(createLogto, config);
|
|
59
|
+
app.mount("#app");
|
|
60
|
+
```
|
|
61
|
+
|
|
62
|
+
### Setup your sign-in
|
|
63
|
+
|
|
64
|
+
```ts
|
|
65
|
+
import { useLogto } from "@logto/vue";
|
|
66
|
+
|
|
67
|
+
const { signIn } = useLogto();
|
|
68
|
+
const onClickSignIn = () => signIn(redirectUrl);
|
|
69
|
+
```
|
|
70
|
+
|
|
71
|
+
```html
|
|
72
|
+
<button @click="onClickSignIn">Sign In</button>
|
|
73
|
+
```
|
|
74
|
+
|
|
75
|
+
### Retrieve Auth Status
|
|
76
|
+
|
|
77
|
+
```ts
|
|
78
|
+
import { useLogto } from '@logto/vue';
|
|
79
|
+
|
|
80
|
+
const { isAuthenticated } = useLogto();
|
|
81
|
+
```
|
|
82
|
+
|
|
83
|
+
```html
|
|
84
|
+
<div v-if="!isAuthenticated">
|
|
85
|
+
<!-- E.g. navigate to the sign in page -->
|
|
86
|
+
</div>
|
|
87
|
+
<div v-else>
|
|
88
|
+
<!-- Do things when user is authenticated -->
|
|
89
|
+
</div>
|
|
90
|
+
```
|
|
91
|
+
|
|
92
|
+
### Sign out
|
|
93
|
+
|
|
94
|
+
```ts
|
|
95
|
+
import { useLogto } from "@logto/vue";
|
|
96
|
+
|
|
97
|
+
const { signOut } = useLogto();
|
|
98
|
+
const onClickSignOut = () => signOut('http://localhost:1234');
|
|
99
|
+
```
|
|
100
|
+
|
|
101
|
+
```html
|
|
102
|
+
<button @click="onClickSignOut">Sign Out</button>
|
|
103
|
+
```
|
|
104
|
+
|
|
105
|
+
## Resources
|
|
106
|
+
|
|
107
|
+
[](https://logto.io/)
|
|
108
|
+
[](https://docs.logto.io/docs/sdk/swift/)
|
|
109
|
+
[](https://discord.gg/UEPaF3j5e6)
|
package/lib/plugin.d.ts
CHANGED
|
@@ -10,7 +10,11 @@ export declare const createPluginMethods: (context: Context) => {
|
|
|
10
10
|
aud: string;
|
|
11
11
|
exp: number;
|
|
12
12
|
iat: number;
|
|
13
|
-
at_hash?: string | undefined;
|
|
13
|
+
at_hash?: string | null | undefined;
|
|
14
|
+
name?: string | null | undefined;
|
|
15
|
+
username?: string | null | undefined;
|
|
16
|
+
avatar?: string | null | undefined;
|
|
17
|
+
role_names?: string[] | null | undefined;
|
|
14
18
|
} | undefined;
|
|
15
19
|
handleSignInCallback: (callbackUri: string, callbackFunction?: (() => void) | undefined) => Promise<undefined>;
|
|
16
20
|
};
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@logto/vue",
|
|
3
|
-
"version": "0.1.
|
|
3
|
+
"version": "0.1.18",
|
|
4
4
|
"main": "./lib/index.js",
|
|
5
5
|
"exports": "./lib/index.js",
|
|
6
6
|
"typings": "./lib/index.d.ts",
|
|
@@ -15,7 +15,6 @@
|
|
|
15
15
|
},
|
|
16
16
|
"scripts": {
|
|
17
17
|
"dev:tsc": "tsc -p tsconfig.build.json -w --preserveWatchOutput",
|
|
18
|
-
"preinstall": "npx only-allow pnpm",
|
|
19
18
|
"precommit": "lint-staged",
|
|
20
19
|
"build": "rm -rf lib/ && tsc -p tsconfig.build.json",
|
|
21
20
|
"lint": "eslint --ext .ts src",
|
|
@@ -24,7 +23,7 @@
|
|
|
24
23
|
"prepack": "pnpm test"
|
|
25
24
|
},
|
|
26
25
|
"dependencies": {
|
|
27
|
-
"@logto/browser": "^0.1.
|
|
26
|
+
"@logto/browser": "^0.1.18"
|
|
28
27
|
},
|
|
29
28
|
"devDependencies": {
|
|
30
29
|
"@jest/types": "^27.5.1",
|
|
@@ -61,5 +60,5 @@
|
|
|
61
60
|
"publishConfig": {
|
|
62
61
|
"access": "public"
|
|
63
62
|
},
|
|
64
|
-
"gitHead": "
|
|
63
|
+
"gitHead": "adf02e1985235ed71efc60f53281e9ab32c0f26a"
|
|
65
64
|
}
|