Skip to content

Commit ecba91e

Browse files
antfuantfu
committed
feat(module): allow to config devtools integrations
fix nuxt/devtools#762
1 parent 314386c commit ecba91e

5 files changed

Lines changed: 96 additions & 59 deletions

File tree

‎package.json‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
{
22
"private": true,
33
"type": "module",
4-
"packageManager": "pnpm@9.15.0",
4+
"packageManager": "pnpm@9.15.1",
55
"version": "0.7.3",
66
"scripts": {
77
"build": "pnpm run -r build",

‎packages/module/src/modules/config/devtools.ts‎

Lines changed: 63 additions & 42 deletions
Original file line numberDiff line numberDiff line change
@@ -3,11 +3,69 @@ import { resolvePath } from 'mlly'
33
import type { Nuxt } from '@nuxt/schema'
44
import { join, dirname } from 'pathe'
55
import { getPort } from 'get-port-please'
6+
import type { ModuleOptions } from '../../types'
7+
8+
export async function setupDevToolsIntegration(
9+
options: ModuleOptions,
10+
nuxt: Nuxt,
11+
) {
12+
const {
13+
enabled = 'lazy',
14+
port,
15+
} = (typeof options.config !== 'boolean' ? options.config || {} : {}).devtools || {}
16+
17+
if (enabled === false)
18+
return
619

7-
export async function setupDevToolsIntegration(nuxt: Nuxt) {
820
let viewerProcess: ReturnType<typeof import('@nuxt/devtools-kit')['startSubprocess']> | undefined
921
let viewerPort: number | undefined
1022
let viewerUrl: string | undefined
23+
let started = false
24+
25+
async function start() {
26+
if (started)
27+
return
28+
started = true
29+
const { startSubprocess } = await import('@nuxt/devtools-kit')
30+
const inspectorBinPath = join(
31+
dirname(await resolvePath(
32+
'@eslint/config-inspector/package.json',
33+
{ url: dirname(fileURLToPath(import.meta.url)) },
34+
)),
35+
'bin.mjs',
36+
)
37+
38+
viewerPort = port || await getPort({
39+
portRange: [8123, 10000],
40+
random: true,
41+
})
42+
viewerProcess = startSubprocess(
43+
{
44+
command: 'node',
45+
args: [inspectorBinPath, '--no-open'],
46+
cwd: nuxt.options.rootDir,
47+
env: {
48+
PORT: viewerPort.toString(),
49+
},
50+
},
51+
{
52+
id: 'eslint-config-inspector',
53+
name: 'ESLint Config Viewer',
54+
},
55+
nuxt,
56+
)
57+
nuxt.callHook('devtools:customTabs:refresh')
58+
59+
// Wait for viewer to be ready
60+
const url = `http://localhost:${viewerPort}`
61+
for (let i = 0; i < 100; i++) {
62+
if (await fetch(url).then(r => r.ok).catch(() => false))
63+
break
64+
await new Promise(resolve => setTimeout(resolve, 500))
65+
}
66+
await new Promise(resolve => setTimeout(resolve, 2000))
67+
viewerUrl = url
68+
}
1169

1270
nuxt.hook('devtools:customTabs', (tabs) => {
1371
tabs.push({
@@ -26,50 +84,13 @@ export async function setupDevToolsIntegration(nuxt: Nuxt) {
2684
{
2785
label: 'Launch',
2886
pending: !!viewerProcess,
29-
handle: async () => {
30-
const { startSubprocess } = await import('@nuxt/devtools-kit')
31-
const inspectorBinPath = join(
32-
dirname(await resolvePath(
33-
'@eslint/config-inspector/package.json',
34-
{ url: dirname(fileURLToPath(import.meta.url)) },
35-
)),
36-
'bin.mjs',
37-
)
38-
39-
viewerPort = await getPort({
40-
portRange: [8123, 10000],
41-
random: true,
42-
})
43-
viewerProcess = startSubprocess(
44-
{
45-
command: 'node',
46-
args: [inspectorBinPath, '--no-open'],
47-
cwd: nuxt.options.rootDir,
48-
env: {
49-
PORT: viewerPort.toString(),
50-
},
51-
},
52-
{
53-
id: 'eslint-config-inspector',
54-
name: 'ESLint Config Viewer',
55-
},
56-
nuxt,
57-
)
58-
nuxt.callHook('devtools:customTabs:refresh')
59-
60-
// Wait for viewer to be ready
61-
const url = `http://localhost:${viewerPort}`
62-
for (let i = 0; i < 100; i++) {
63-
if (await fetch(url).then(r => r.ok).catch(() => false))
64-
break
65-
await new Promise(resolve => setTimeout(resolve, 500))
66-
}
67-
await new Promise(resolve => setTimeout(resolve, 2000))
68-
viewerUrl = url
69-
},
87+
handle: start,
7088
},
7189
],
7290
},
7391
})
7492
})
93+
94+
if (enabled === true)
95+
start()
7596
}

‎packages/module/src/modules/config/index.ts‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -55,7 +55,7 @@ export async function setupConfigGen(options: ModuleOptions, nuxt: Nuxt) {
5555
},
5656
})
5757

58-
setupDevToolsIntegration(nuxt)
58+
setupDevToolsIntegration(options, nuxt)
5959

6060
await writeConfigFile()
6161
nuxt.hook('builder:generateApp', () => {

‎packages/module/src/types.ts‎

Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -34,6 +34,22 @@ export interface ConfigGenOptions extends NuxtESLintFeaturesOptions {
3434
* @default nuxt.options.rootDir
3535
*/
3636
rootDir?: string
37+
38+
/**
39+
* Options for DevTools integration
40+
*/
41+
devtools?: {
42+
/**
43+
* Enable ESLint config inspector in DevTools
44+
*
45+
* @default 'lazy'
46+
*/
47+
enabled?: boolean | 'lazy'
48+
/**
49+
* Port for the ESLint config inspector
50+
*/
51+
port?: number
52+
}
3753
}
3854

3955
export interface CheckerOptions {

‎pnpm-workspace.yaml‎

Lines changed: 15 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -5,15 +5,15 @@ packages:
55
- docs
66
catalog:
77
'@antfu/install-pkg': ^0.5.0
8-
'@clack/prompts': ^0.8.2
8+
'@clack/prompts': ^0.9.0
99
'@eslint/config-inspector': ^0.6.0
1010
'@eslint/js': ^9.16.0
11-
'@iconify-json/catppuccin': ^1.2.7
12-
'@iconify-json/ph': ^1.2.1
13-
'@iconify-json/simple-icons': ^1.2.15
11+
'@iconify-json/catppuccin': ^1.2.8
12+
'@iconify-json/ph': ^1.2.2
13+
'@iconify-json/simple-icons': ^1.2.16
1414
'@nuxt/content': ^2.13.4
1515
'@nuxt/devtools': 1.3.1
16-
'@nuxt/devtools-kit': ^1.6.3
16+
'@nuxt/devtools-kit': ^1.6.4
1717
'@nuxt/fonts': ^0.10.3
1818
'@nuxt/image': ^1.8.1
1919
'@nuxt/kit': ^3.14.1592
@@ -26,24 +26,24 @@ catalog:
2626
'@nuxtjs/plausible': ^1.2.0
2727
'@stylistic/eslint-plugin': ^2.12.1
2828
'@types/node': ^22.10.2
29-
'@typescript-eslint/eslint-plugin': ^8.18.0
30-
'@typescript-eslint/parser': ^8.18.0
31-
'@typescript-eslint/scope-manager': ^8.18.0
32-
'@typescript-eslint/types': ^8.18.0
33-
'@typescript-eslint/utils': ^8.18.0
29+
'@typescript-eslint/eslint-plugin': ^8.18.1
30+
'@typescript-eslint/parser': ^8.18.1
31+
'@typescript-eslint/scope-manager': ^8.18.1
32+
'@typescript-eslint/types': ^8.18.1
33+
'@typescript-eslint/utils': ^8.18.1
3434
'@vueuse/core': ^12.0.0
3535
'@vueuse/nuxt': ^12.0.0
36-
bumpp: ^9.9.0
37-
chokidar: ^4.0.1
38-
eslint: ^9.16.0
36+
bumpp: ^9.9.1
37+
chokidar: ^4.0.3
38+
eslint: ^9.17.0
3939
eslint-config-flat-gitignore: 0.2.0
4040
eslint-config-standard: ^17.1.0
4141
eslint-flat-config-utils: ^0.4.0
4242
eslint-import-resolver-typescript: ^3.7.0
4343
eslint-merge-processors: ^0.1.0
4444
eslint-plugin-format: ^0.1.3
4545
eslint-plugin-import: ^2.31.0
46-
eslint-plugin-import-x: ^4.5.0
46+
eslint-plugin-import-x: ^4.6.1
4747
eslint-plugin-jsdoc: ^50.6.1
4848
eslint-plugin-n: ^17.15.0
4949
eslint-plugin-promise: ^7.2.1
@@ -56,7 +56,7 @@ catalog:
5656
fast-glob: ^3.3.2
5757
find-up: ^7.0.0
5858
get-port-please: ^3.1.2
59-
globals: ^15.13.0
59+
globals: ^15.14.0
6060
local-pkg: ^0.5.1
6161
mlly: ^1.7.3
6262
nuxt: ^3.14.1592

0 commit comments

Comments
 (0)