diff --git a/docs/guide/standalone.md b/docs/guide/standalone.md index 0d0d160b..0c090768 100644 --- a/docs/guide/standalone.md +++ b/docs/guide/standalone.md @@ -101,10 +101,6 @@ Then import it directly in your app: import { devtools } from '@vue/devtools' ``` -:::tip Important -Make sure you import devtools before Vue, otherwise it might not work as expected. -::: - And connect to host: ```ts @@ -112,6 +108,10 @@ if (process.env.NODE_ENV === 'development') devtools.connect(/* host, port */) ``` +:::tip Important +Make sure to invoke devtools connect function before creating Vue App, otherwise it might not work as expected. +::: + **host** - is an optional argument that tells your application where devtools middleware server is running, if you debug your app on your computer you don't have to set this (the default is `http://localhost`), but if you want to debug your app on mobile devices, you might want to pass your local IP (e.g. `http://192.168.1.12`). **port** - is an optional argument that tells your application on what port devtools middleware server is running. If you use proxy server, you might want to set it to `null` so the port won't be added to connection URL. diff --git a/packages/electron/package.json b/packages/electron/package.json index c016d5fc..c1573e76 100644 --- a/packages/electron/package.json +++ b/packages/electron/package.json @@ -27,7 +27,8 @@ "scripts": { "build": "tsx scripts/build.ts", "dev": "tsx scripts/build.ts --watch", - "prepare:type": "tsup src/index.ts --dts-only --format cjs,esm" + "prepare:type": "tsup src/index.ts --dts-only --format cjs,esm", + "stub": "pnpm dev" }, "dependencies": { "@vue/devtools-core": "workspace:^", diff --git a/packages/electron/src/index.ts b/packages/electron/src/index.ts index 08bce5ed..77296761 100644 --- a/packages/electron/src/index.ts +++ b/packages/electron/src/index.ts @@ -1,14 +1,10 @@ -import { isBrowser, target } from '@vue/devtools-shared' +import { target } from '@vue/devtools-shared' import { devtools } from '../../devtools-kit/src/index' export async function connect(host: string, port: number) { devtools.init() target.__VUE_DEVTOOLS_HOST__ = host target.__VUE_DEVTOOLS_PORT__ = port - if (isBrowser) - import('./user-app.js') - - else // @ts-expect-error skip - import('./user-app.mjs') + import('./user-app.mjs') }