Skip to content

Commit fb23644

Browse files
webfansplzwebfansplz
committed
feat: devtools
1 parent 430d67b commit fb23644

File tree

11 files changed

+1227
-36
lines changed

11 files changed

+1227
-36
lines changed

‎package.json

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -9,8 +9,8 @@
99
},
1010
"scripts": {
1111
"release": "node scripts/release.mjs",
12-
"stub": "pnpm run -r --filter './packages/{core,vite-plugin-vue-termui,cli}' stub",
13-
"build": "pnpm run -r --filter './packages/{core,vite-plugin-vue-termui,cli}' build",
12+
"stub": "pnpm run -r --filter './packages/{core,vite-plugin-vue-termui,cli,devtools}' stub",
13+
"build": "pnpm run -r --filter './packages/{core,vite-plugin-vue-termui,cli,devtools}' build",
1414
"play:dev": "pnpm run --filter './packages/playground' dev",
1515
"lint": "prettier --check packages README.md",
1616
"lint:fix": "prettier --write packages README.md",

‎packages/devtools/package.json

Lines changed: 71 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,71 @@
1+
{
2+
"name": "@vue-termui/devtools",
3+
"private": false,
4+
"publishConfig": {
5+
"access": "public"
6+
},
7+
"type": "module",
8+
"version": "0.0.1",
9+
"scripts": {
10+
"stub": "unbuild --stub",
11+
"build": "tsup",
12+
"changelog": "conventional-changelog -p angular -i CHANGELOG.md -s --commit-path . -l @vue-termui/devtools -r 1"
13+
},
14+
"exports": {
15+
".": {
16+
"import": "./dist/index.mjs",
17+
"require": "./dist/index.cjs",
18+
"types": "./dist/index.d.ts"
19+
},
20+
"./*": "./*"
21+
},
22+
"main": "./dist/index.cjs",
23+
"module": "./dist/index.mjs",
24+
"types": "./dist/index.d.ts",
25+
"bin": {
26+
"vtui-devtools": "./node_modules/.bin/vue-devtools"
27+
},
28+
"files": [
29+
"dist/**/*.js",
30+
"dist/**/*.mjs",
31+
"dist/**/*.cjs",
32+
"dist/**/*.d.ts",
33+
"vtui.mjs"
34+
],
35+
"keywords": [
36+
"devtools",
37+
"@vue/devtools"
38+
],
39+
"funding": "https://github.com/vue-terminal/vue-termui?sponsor=1",
40+
"license": "MIT",
41+
"author": "webfansplz",
42+
"repository": {
43+
"type": "git",
44+
"url": "https://github.com/vue-terminal/vue-termui.git",
45+
"directory": "packages/devtools"
46+
},
47+
"engines": {
48+
"node": ">=14.0.0"
49+
},
50+
"bugs": {
51+
"url": "https://github.com/vue-terminal/vue-termui/issues"
52+
},
53+
"homepage": "https://github.com/vue-terminal/vue-termui#readme",
54+
"dependencies": {
55+
"@vue/devtools": "^6.4.5",
56+
"express": "^4.18.2",
57+
"launch-editor-middleware": "^2.6.0"
58+
},
59+
"unbuild": {
60+
"entries": [
61+
"src/index"
62+
],
63+
"rollup": {
64+
"emitCJS": true
65+
},
66+
"clean": true
67+
},
68+
"devDependencies": {
69+
"@types/express": "^4.17.14"
70+
}
71+
}

‎packages/devtools/src/global.d.ts

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
declare global {
2+
var document: {
3+
title: string
4+
createElement: () => {}
5+
querySelector: () => {}
6+
querySelectorAll: () => []
7+
}
8+
var VUE_DEVTOOLS_CONFIG: {
9+
openInEditorHost: string
10+
}
11+
}
12+
13+
export {}

‎packages/devtools/src/index.ts

Lines changed: 44 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,44 @@
1+
import devtools from '@vue/devtools'
2+
import express from 'express'
3+
// @ts-ignore
4+
import launchMiddleware from 'launch-editor-middleware'
5+
6+
export interface DevtoolsOptions {
7+
title?: string
8+
host?: string
9+
openInEditor?: boolean
10+
}
11+
12+
const SERVER_PORT = 8098
13+
14+
export function createDevtools(options: DevtoolsOptions = {}) {
15+
const {
16+
host = 'http://localhost',
17+
openInEditor = true,
18+
title = 'vue-termui devtools',
19+
} = options
20+
21+
// workaround for @vue/devtools
22+
global.document = {
23+
title,
24+
createElement: () => ({}),
25+
querySelector: () => ({}),
26+
querySelectorAll: () => [],
27+
}
28+
29+
if (openInEditor) {
30+
global.VUE_DEVTOOLS_CONFIG = {
31+
openInEditorHost: `${host}:${SERVER_PORT}/`,
32+
}
33+
const app = express()
34+
app.use('/__open-in-editor', launchMiddleware())
35+
app.listen(SERVER_PORT)
36+
}
37+
38+
return {
39+
devtools,
40+
connect() {
41+
devtools.connect(host, SERVER_PORT)
42+
},
43+
}
44+
}

‎packages/devtools/tsconfig.json

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
{
2+
"extends": "../../tsconfig.json",
3+
"compilerOptions": {
4+
"target": "esnext",
5+
"module": "esnext",
6+
"sourceMap": true,
7+
"lib": ["esnext"]
8+
},
9+
"include": ["src/*.ts", "src/*.d.ts"]
10+
}

‎packages/devtools/tsup.config.ts

Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,14 @@
1+
import { defineConfig } from 'tsup'
2+
import { dependencies } from './package.json'
3+
4+
export default defineConfig({
5+
clean: true,
6+
target: 'node14',
7+
format: ['esm', 'cjs'],
8+
dts: true,
9+
esbuildOptions(options) {
10+
if (options.format === 'esm') options.outExtension = { '.js': '.mjs' }
11+
},
12+
entry: ['src/index.ts'],
13+
external: [...Object.keys(dependencies)],
14+
})

‎packages/playground/components.d.ts

Lines changed: 0 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -7,13 +7,6 @@ export {}
77

88
declare module '@vue/runtime-core' {
99
export interface GlobalComponents {
10-
Box: typeof import('vue-termui')['TuiBox']
11-
Br: typeof import('vue-termui')['TuiNewline']
12-
Div: typeof import('vue-termui')['TuiBox']
13-
Input: typeof import('./src/components/Input.vue')['default']
14-
Link: typeof import('vue-termui')['TuiLink']
15-
Newline: typeof import('vue-termui')['TuiNewline']
16-
Progressbar: typeof import('vue-termui')['TuiProgressBar']
1710
Text: typeof import('vue-termui')['TuiText']
1811
}
1912
}

‎packages/playground/package.json

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,8 @@
44
"type": "module",
55
"scripts": {
66
"dev": "vtui dev",
7-
"build": "vtui build"
7+
"build": "vtui build",
8+
"devtools": "vtui-devtools"
89
},
910
"license": "MIT",
1011
"engines": {
@@ -14,6 +15,7 @@
1415
"@vue-termui/cli": "workspace:*",
1516
"@vue/runtime-core": "^3.2.41",
1617
"vite-plugin-vue-termui": "workspace:*",
17-
"vue-termui": "workspace:*"
18+
"vue-termui": "workspace:*",
19+
"@vue-termui/devtools": "workspace:*"
1820
}
1921
}

‎packages/playground/src/main.ts

Lines changed: 5 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,8 @@
1-
// import devtools from '@vue/devtools'
2-
// import devtools from '@vue/devtools/node'
1+
if (process.env.NODE_ENV === 'development') {
2+
import('@vue-termui/devtools').then(({ createDevtools }) => {
3+
createDevtools().connect()
4+
})
5+
}
36
import { createApp } from 'vue-termui'
47
// import App from './Focusables.vue'
58
// import App from './Fragments.vue'

‎packages/playground/vite.config.cjs

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -34,6 +34,7 @@ export default defineConfig({
3434
alias: {
3535
// Use development version instead of dist
3636
'vue-termui': resolve('../core/src/index.ts'),
37+
'@vue-termui/devtools': resolve('../devtools/src/index.ts'),
3738
},
3839
},
3940

0 commit comments

Comments
 (0)
pFad - Phonifier reborn

Pfad - The Proxy pFad of © 2024 Garber Painting. All rights reserved.

Note: This service is not intended for secure transactions such as banking, social media, email, or purchasing. Use at your own risk. We assume no liability whatsoever for broken pages.


Alternative Proxies:

Alternative Proxy

pFad Proxy

pFad v3 Proxy

pFad v4 Proxy