@vingy/vuebugger 0.3.0 → 0.3.3
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 +48 -0
- package/dist/index.d.mts +1 -1
- package/dist/index.mjs +3 -4
- package/package.json +2 -4
package/README.md
ADDED
|
@@ -0,0 +1,48 @@
|
|
|
1
|
+
# Vuebugger
|
|
2
|
+
|
|
3
|
+
Vue devtools provide an easy way to inspect component state. But when having something like a composable, you actually need to catch all the returned values in order for them to show up in the devtools. This is where this package can come in handy.
|
|
4
|
+
|
|
5
|
+
## Features
|
|
6
|
+
|
|
7
|
+
- Debug composables and reactive state easily
|
|
8
|
+
- Tree-shakable with zero runtime overhead
|
|
9
|
+
- Simple API: just call `debug(name, state)`
|
|
10
|
+
|
|
11
|
+
## Quick start
|
|
12
|
+
|
|
13
|
+
```bash
|
|
14
|
+
pnpm add -D @vingy/vuebugger
|
|
15
|
+
```
|
|
16
|
+
|
|
17
|
+
Register the plugin in your app:
|
|
18
|
+
|
|
19
|
+
```ts
|
|
20
|
+
import Vuebugger from '@vingy/vuebugger'
|
|
21
|
+
|
|
22
|
+
createApp(App).use(Vuebugger)
|
|
23
|
+
```
|
|
24
|
+
|
|
25
|
+
## Usage
|
|
26
|
+
|
|
27
|
+
`debug()` registers values from composables so they show up in Vue Devtools.
|
|
28
|
+
|
|
29
|
+
```ts
|
|
30
|
+
import { debug } from '@vingy/vuebugger'
|
|
31
|
+
|
|
32
|
+
export const useFoo = (initial: number) => {
|
|
33
|
+
const multiplier = ref(1) // not easy to debug if something goes wrong
|
|
34
|
+
|
|
35
|
+
const inc = () => multiplier.value++
|
|
36
|
+
const dec = () => multiplier.value--
|
|
37
|
+
|
|
38
|
+
const value = computed(() => initial * multiplier)
|
|
39
|
+
|
|
40
|
+
debug('useFoo', { multiplier }) // now visible in devtools
|
|
41
|
+
|
|
42
|
+
return { value, inc, dec }
|
|
43
|
+
}
|
|
44
|
+
```
|
|
45
|
+
|
|
46
|
+
See the demo app in [demo/](../../demo/).
|
|
47
|
+
|
|
48
|
+
> **Note:** This plugin is tree-shakable and has zero runtime overhead when `debug()` calls are not used.
|
package/dist/index.d.mts
CHANGED
|
@@ -27,6 +27,6 @@ type PluginOptions = {
|
|
|
27
27
|
declare const debug: <T extends Record<string, any>>(groupId: VuebuggerEntry["groupId"], state: T) => T;
|
|
28
28
|
//#endregion
|
|
29
29
|
//#region src/index.d.ts
|
|
30
|
-
declare const plugin$1: Plugin<PluginOptions
|
|
30
|
+
declare const plugin$1: Plugin<[PluginOptions?]>;
|
|
31
31
|
//#endregion
|
|
32
32
|
export { plugin$1 as DebugPlugin, plugin$1 as default, debug };
|
package/dist/index.mjs
CHANGED
|
@@ -63,7 +63,7 @@ const debug = (groupId, state) => {
|
|
|
63
63
|
};
|
|
64
64
|
|
|
65
65
|
//#endregion
|
|
66
|
-
//#region ../../node_modules/.pnpm/@vue+devtools-shared@8.0.
|
|
66
|
+
//#region ../../node_modules/.pnpm/@vue+devtools-shared@8.0.6/node_modules/@vue/devtools-shared/dist/index.js
|
|
67
67
|
var __create$1 = Object.create;
|
|
68
68
|
var __defProp$1 = Object.defineProperty;
|
|
69
69
|
var __getOwnPropDesc$1 = Object.getOwnPropertyDescriptor;
|
|
@@ -496,7 +496,7 @@ function createHooks() {
|
|
|
496
496
|
}
|
|
497
497
|
|
|
498
498
|
//#endregion
|
|
499
|
-
//#region ../../node_modules/.pnpm/@vue+devtools-kit@8.0.
|
|
499
|
+
//#region ../../node_modules/.pnpm/@vue+devtools-kit@8.0.6/node_modules/@vue/devtools-kit/dist/index.js
|
|
500
500
|
var __create = Object.create;
|
|
501
501
|
var __defProp = Object.defineProperty;
|
|
502
502
|
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
@@ -3954,7 +3954,6 @@ const plugin = { install: (app, options) => {
|
|
|
3954
3954
|
if (options?.uidFn) setUidGenerator(options.uidFn);
|
|
3955
3955
|
setupComposableDevtools(app);
|
|
3956
3956
|
} };
|
|
3957
|
-
var src_default = plugin;
|
|
3958
3957
|
|
|
3959
3958
|
//#endregion
|
|
3960
|
-
export { plugin as DebugPlugin,
|
|
3959
|
+
export { plugin as DebugPlugin, plugin as default, debug };
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@vingy/vuebugger",
|
|
3
|
-
"version": "0.3.
|
|
3
|
+
"version": "0.3.3",
|
|
4
4
|
"description": "Vue devtools plugin to debug anything.",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"composable",
|
|
@@ -15,7 +15,7 @@
|
|
|
15
15
|
"author": "vingy",
|
|
16
16
|
"repository": {
|
|
17
17
|
"type": "git",
|
|
18
|
-
"url": "https://github.com/vinpogo/
|
|
18
|
+
"url": "https://github.com/vinpogo/vue-utils"
|
|
19
19
|
},
|
|
20
20
|
"files": [
|
|
21
21
|
"dist"
|
|
@@ -40,8 +40,6 @@
|
|
|
40
40
|
"vue": "^3.5.0"
|
|
41
41
|
},
|
|
42
42
|
"scripts": {
|
|
43
|
-
"test": "vitest",
|
|
44
|
-
"test:ci": "vitest run --coverage",
|
|
45
43
|
"build": "tsdown",
|
|
46
44
|
"dev": "tsdown -w"
|
|
47
45
|
}
|