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)