Hacktoberfest 2026: los issues que los mantenedores marcaron para octubre, abiertos y aptos para principiantes. Explorar issues de Hacktoberfest

docs: manual client injection examples reference removed exports

Abierto Apto para principiantes
  • ¿Algo no está bien?
#589 1 comentario 0 reacciones 0 asignados Ver en GitHub

Los mantenedores suelen responder en 1 día

Nadie ha tomado este issue todavía.

Evaluación

Dificultad
2/5
Tiempo estimado
1-3 horas
Aptitud para principiantes
74/100
Tipo de issue
Documentación
Claridad
Bastante claro
Estado de actividad
Activo
Stack tecnológico
javascript
Área
documentation

Línea de trabajo

Lee la sección Getting Started para proyectos sin una entrada HTML y la página Client Script & Client Context; después, revisa el commit 352456fb sobre la migración a @devframes/hub-ui. Actualiza ambas páginas para que usen la entrada actual /__devtools/embedded.js, documenta sus requisitos de alojamiento y conexión, y sincroniza los ejemplos del modo de visibilidad; se considera terminado cuando ya no se haga referencia a las antiguas exportaciones de inyección.

Escrito por el modelo de indexación a partir del texto del issue.

Descripción

Describe the bug

The manual client injection documentation still tells users to import @vitejs/devtools/client/inject, although that entry was removed when Vite DevTools adopted the @devframes/hub-ui client.

Affected pages:

This matters for backend-served HTML, middleware integrations, and JavaScript-only entries where automatic HTML injection does not run. Following the documented import fails during module resolution, before the client can initialize.

The @ts-expect-error comment in the guide addresses missing type declarations; it cannot suppress this module-resolution failure.

Reproduction

Using the published package, without building DevTools from source:

mkdir devtools-manual-injection-repro
cd devtools-manual-injection-repro
pnpm init
pnpm add -D -E [email protected] @vitejs/[email protected]
node --input-type=module -e "console.log(import.meta.resolve('@vitejs/devtools/client/inject'))"

Actual result:

ERR_PACKAGE_PATH_NOT_EXPORTED
Package subpath './client/inject' is not defined by "exports"

This is also reproducible through Vite with DevTools explicitly enabled. Create check.mjs:

import { createServer } from 'vite'
import { DevTools } from '@vitejs/devtools'
import { writeFile } from 'node:fs/promises'

await writeFile('old.js', "import '@vitejs/devtools/client/inject'\n")
const server = await createServer({
  configFile: false,
  plugins: await DevTools({ builtinDevTools: false }),
  server: { host: '127.0.0.1', port: 5173, strictPort: true },
  devtools: { open: false },
})

try {
  await server.listen()
  await server.transformRequest('/old.js')
}
finally {
  await server.close()
}

Run node check.mjs. The Vite transformation fails with:

"./client/inject" is not exported under the conditions
["module", "browser", "development", "import"]

The published package also does not export ./client/inject-passive or ./client/inject-hidden, both of which are still shown in the guide.

Migration evidence

Commit 352456fb in #529 removed the old client directory and the three injection exports, added @devframes/hub-ui, and changed injection to load the hub-served /__devtools/embedded.js script.

The capability still exists. I verified a backend-served HTML page that loads this script through a same-origin HTTP/WebSocket proxy to Vite: after authorization, the dock appeared and the Settings panel opened. This verifies that setup, not arbitrary cross-origin configurations.

Expected behavior

Please update the manual integration instructions to describe the current supported entry and its hosting/connection requirements, and synchronize the client-context explanation and visibility-mode examples.

The request is to retain and update the manual integration guidance. It does not require restoring the removed npm exports or deleting support for backend-served pages.

Environment
  • vite: 8.3.0
  • @vitejs/devtools: 0.7.5
  • Package manager: pnpm
  • Reproduced on macOS using published packages.
Lenguaje dominante
TypeScript
Estrellas
1.2k
Forks
91
Merge medio
1 d 4 h
PR fusionados (30 d)
20

Preparar el entorno

Primeros pasos

  1. Lee el issue completo y luego la guía de contribución del proyecto.
  2. Comenta en el issue que vas a ocuparte — evita que dos personas hagan lo mismo.
  3. Haz un fork del repositorio y trabaja en una rama.
  4. Abre un pull request que haga referencia al número del issue.

Más de vitejs/devtools

Todos los issues de vitejs/devtools

Issues similares

Más issues de TypeScript

Recibe los nuevos issues en tu correo

Un resumen breve de issues de GitHub para principiantes.