nuxt / devtools Goto Github PK
View Code? Open in Web Editor NEWUnleash Nuxt Developer Experience
Home Page: https://devtools.nuxt.com
License: MIT License
Unleash Nuxt Developer Experience
Home Page: https://devtools.nuxt.com
License: MIT License
ERROR Cannot start nuxt: EISDIR: illegal operation on a directory, read 21:11:19
at Object.readSync (node:fs:748:3)
at tryReadSync (node:fs:448:20)
at readFileSync (node:fs:494:19)
at jiti (node_modules\jiti\dist\jiti.js:1:249418)
at requireModule (/D:/Programming/got/node_modules/@nuxt/kit/dist/index.mjs:286:26)
at normalizeModule (/D:/Programming/got/node_modules/@nuxt/kit/dist/index.mjs:454:55)
at installModule (/D:/Programming/got/node_modules/@nuxt/kit/dist/index.mjs:434:47)
at initNuxt (/D:/Programming/got/node_modules/nuxt/dist/index.mjs:2162:13)
at async load (/D:/Programming/got/node_modules/nuxi/dist/chunks/dev.mjs:6798:9)
at async Object.invoke (/D:/Programming/got/node_modules/nuxi/dist/chunks/dev.mjs:6859:5)
Complete log - https://goonlinetools.com/snapshot/code/#wvt19nma0qnsi0vouyfl9
Quickly jump to a tab or run a feature.
ERROR Cannot start nuxt: performance is not defined
at node_modules/.pnpm/@nuxt[email protected][email protected][email protected]/node_modules/@nuxt/devtools/dist/chunks/module-main.mjs:5196:16
An error about performance occurs when starting a blank Nuxt app in Mac @nuxt/[email protected] + [email protected] + [email protected]
https://github.com/yue7872/template-nuxt
Provide a tab for displaying API routes from Nitro, and a playground to send request
Reproduction:
chore/devtools
branchnpm run dev
Darwin
v18.14.1
3.2.2
2.2.2
[email protected]
vite
-
-
-
Git clone [email protected]:alvarosabu/portfolio.git
pnpm install
pnpm build:ci
cd apps/portfolio
pnpm dev:https
This started happening after installing @nuxt/devtools
with npx and updating nuxt to v3.2.2
The server keeps reloading forever in the browser
[ERROR] Cannot start service: Host version "0.17.10" does not match binary version "0.17.5"
No response
✔ Nuxt Devtools is enabled v0.1.4 (experimental) 08:46:08
WARN Sourcemap for "/__uno.css" points to missing source files 08:46:11
ℹ Vite client warmed up in 1953ms 08:46:11
✘ [ERROR] Cannot start service: Host version "0.17.10" does not match binary version "0.17.5"
1 error
ERROR Error: The service was stopped nitro 08:46:11
undefined
✔ Nitro built in 127 ms nitro 08:46:11
I executed npx nuxi devtools enable
and it installed some kind of global package that stops nuxt 2
projects from working!
I tried uninstalling the global @nuxt/devtools
package and it still gives me errors (different one tho):
It gives me this error on my other (old) project:
WARN Module C:/Program Files/nodejs/node_modules/@nuxt/devtools/dist/module.mjs not found. Please ensure C:/Program Files/nodejs/node_modules/@nuxt/devtools/dist/module.mjs is in dependencies and installed.
FATAL Cannot find module 'C:/Program Files/nodejs/node_modules/@nuxt/devtools/dist/module.mjs' 22:28:55
Require stack:
- D:\Development\Repositories\cimaba\node_modules\@nuxt\core\dist\core.js
Require stack:
- node_modules\@nuxt\core\dist\core.js
at Function.Module._resolveFilename (node:internal/modules/cjs/loader:995:15)
at Function.resolve (node:internal/modules/cjs/helpers:109:19)
at _resolve (node_modules\jiti\dist\jiti.js:1:192796)
at Resolver.jiti [as _require] (node_modules\jiti\dist\jiti.js:1:195025)
at Resolver.requireModule (node_modules\@nuxt\core\dist\core.js:381:29)
at ModuleContainer.addModule (node_modules\@nuxt\core\dist\core.js:182:38)
at node_modules\@nuxt\utils\dist\utils.js:639:43
at async ModuleContainer.ready (node_modules\@nuxt\core\dist\core.js:55:5)
at async Nuxt._init (node_modules\@nuxt\core\dist\core.js:478:5)
✖ Nuxt Fatal Error
Error: Cannot find module 'C:/Program Files/nodejs/node_modules/@nuxt/devtools/dist/module.mjs'
Require stack:
- D:\Development\Repositories\cimaba\node_modules@nuxt\core\dist\core.js
I tried deleting my node_modules
and reinstalled everything, and it still doesn't work.
Also, there is no changes in my git, and it was working before installing the @nuxt/devtools
I have enabled devtools for the project running Nuxt 3.2.0 and whenever I run nuxi dev
I get the following output:
Nuxt 3.2.0 with Nitro 2.2.1 13:05:40
13:05:41
> Local: http://localhost:3000/
> Network: http://172.21.0.1:3000/
> Network: http://192.168.1.122:3000/
i Using default Tailwind CSS file from runtime/tailwind.css nuxt:tailwindcss 13:05:42
√ Nuxt Devtools is enabled v0.1.2 (experimental) 13:05:42
i Tailwind Viewer: http://localhost:3000/_tailwind/ nuxt:tailwindcss 13:05:43
ERROR Failed to load url /@fs/C:/Users/user/AppData/Roaming/nvm/v16.18.0/node_modules/@nuxt/devtools/node_modules/vite-plugin-vue-inspector/src/load.js (resolved id: C:/Users/user/AppData/Roaming/nvm/v16.18.0/node_modules/@nuxt/devtools/node_modules/vite-plugin-vue-inspector/src/load.js?v=d57f6aaf). Does the file exist?
ERROR Failed to load url /@fs/C:/Users/user/AppData/Roaming/nvm/v16.18.0/node_modules/@nuxt/devtools/dist/runtime/plugins/devtools.client.mjs?v=d57f6aaf (resolved id: C:/Users/user/AppData/Roaming/nvm/v16.18.0/node_modules/@nuxt/devtools/dist/runtime/plugins/devtools.client.mjs?v=d57f6aaf). Does the file exist?
13:05:40
i Vite client warmed up in 4084ms 13:05:48
√ Nitro built in 1235 ms
Any ideas? Maybe related to nvm
usage or something similar?
Someone made a Nuxt module when the devtools did not exist to view the images in the public directory: https://github.com/cssninjaStudio/nuxt-media-viewer
Here's a preview in the nuxt.com website:
http://volta.s3.fr-par.scw.cloud/Clean_Shot_2023_02_23_at_14_12_17_30d1684814.mp4
The downside is that it extends the Nuxt pages so the implementation in not correct but I do love the idea.
Maybe something we could add with Nuxt Image module?
Hi guys,
so i just tested these devtools (with Node 18), but now I cannot disable it anymore.
Even though it says
Nuxt Devtools is not enabled for this project.
I always get
✔ Nuxt Devtools is enabled v0.1.2 (experimental)
Also if i switch to another project which runs on Node 16, I always get Node 18 errors as this was the version i initially installed the devtools.
The request url "/Users/…/.nvm/versions/node/v18.10.0/lib/node_modules/@nuxt/devtools/dist/runtime/plugins/devtools.client.mjs" is outside of Vite serving allow list.
Therefor I cannot use any of my other nuxt3 projects anymore.
.nuxtrc
is not existent / empty. Is it mandatory?
How to fix this?
Follow-up of #61, most likely due to c7f83f8
When starting current main branch locally, you receive the following error message. Reverting c7f83f8 fixes the issue.
Uncaught Error: Module "node:perf_hooks" has been externalized for browser compatibility. Cannot access "node:perf_hooks.performance" in client code. See http://vitejs.dev/guide/troubleshooting.html#module-externalized-for-browser-compatibility for more details.
(feel free to add your ideas or discuss below!)
My nuxt app is served locally with ssl on a .test
domain for sharing cookies with other projects. When I enabled devtools and clicked the icon in the bottom of my page i got an error about the websocket connection needing to be secure.
i was able to change ws to wss in my global module here, and then it worked perfectly
devtools/client/composables/rpc.ts
Line 27 in 1c0f44c
can there be an option to detect/or configure this in the future?
We have quite a few tabs right now, and we plan to have many more, in addition to more and more modules contributing to it. The navbar will grow quite long as we go. We should provide a way to better organize them and make groups expandable.
I have faced this issue trying to install the devtool in nuxt as a module.
Here is some info for context:
OS: Ubuntu 22.04
Node: v16.19.1
tested with local node install and in a dev container.
Module installed on the project:
modules: [
"@nuxtjs/tailwindcss",
"nuxt-social-tags",
"@nuxtjs/i18n",
"nuxt-directus",
"nuxt-headlessui",
"@vueuse/nuxt",
"@nuxt/devtools",
// "@nuxtjs/partytown",
],
dependencies:
"devDependencies": {
"@nuxt/devtools": "^0.2.5",
"@nuxtjs/i18n": "^8.0.0-beta.10",
"@nuxtjs/partytown": "^1.3.0",
"@nuxtjs/tailwindcss": "^6.4.0",
"@tailwindcss/forms": "^0.5.3",
"@vueuse/core": "^9.6.0",
"@vueuse/nuxt": "^9.6.0",
"nuxt": "^3.2.3",
"nuxt-headlessui": "^1.1.1"
},
"dependencies": {
"nuxt-directus": "^3.2.2",
"nuxt-social-tags": "^1.2.3",
"stripe": "^11.6.0"
}
logs:
ERROR Unquoted attribute value cannot contain U+0022 ("), U+0027 ('), U+003C (<), U+003D (=), and U+0060 (`).
ERROR Unquoted attribute value cannot contain U+0022 ("), U+0027 ('), U+003C (<), U+003D (=), and U+0060 (`).
ERROR Unquoted attribute value cannot contain U+0022 ("), U+0027 ('), U+003C (<), U+003D (=), and U+0060 (`).
ERROR Unquoted attribute value cannot contain U+0022 ("), U+0027 ('), U+003C (<), U+003D (=), and U+0060 (`).
ERROR Unquoted attribute value cannot contain U+0022 ("), U+0027 ('), U+003C (<), U+003D (=), and U+0060 (`).
ERROR Unquoted attribute value cannot contain U+0022 ("), U+0027 ('), U+003C (<), U+003D (=), and U+0060 (`).
ERROR Unquoted attribute value cannot contain U+0022 ("), U+0027 ('), U+003C (<), U+003D (=), and U+0060 (`). (repeated 3 times)
ℹ Vite client warmed up in 1824ms
✔ Nitro built in 172 ms
locale it-IT
[Vue warn]: Unhandled error during execution of setup function
at <LayoutLoader key="default" name="default" hasTransition=true >
[nuxt] error caught during app initialization [[vite-node] [plugin:vite-plugin-vue-inspector] [18] /components/corporate/navbar.vue?vue&type=i18n&index=0&lang.yaml <br><pre>export default function (Component) {
Component.__i18n = Component.__i18n || []
Component.__i18n.push({
"locale": "",
"resource": {
"en-US": {
"menu-path": {
"smalti-universali": (()=>{const fn=(ctx) => {const { normalize: _normalize } = ctx;return _normalize(["/brand/p/smalti-universali"])};fn.source="/brand/p/smalti-universali";return fn;})(),
"fondi-protettivi": (()=>{const fn=(ctx) => {const { normalize: _normalize } = ctx;return _normalize(["/brand/p/fondi-protettivi"])};fn.source="/brand/p/fondi-protettivi";return fn;})(),
"trattamento-legno": (()=>{const fn=(ctx) => {const { normalize: _normalize } = ctx;return _normalize(["/brand/p/trattamento-legno"])};fn.source="/brand/p/trattamento-legno";return fn;})()
}
},
"it-IT": {
"title": (()=>{const fn=(ctx) => {const { normalize: _normalize } = ctx;return _normalize(["Questa è la Pagina di <b data-v-inspector=\"components/corporate/navbar.vue:176:32\">brand</b>"])};fn.source="Questa è la Pagina di <b data-v-inspector=\"components/corporate/navbar.vue:176:32\">brand</b>";return fn;})(),
"seo": {
"title": (()=>{const fn=(ctx) => {const { normalize: _normalize } = ctx;return _normalize(["brand: ecosmalto per tutte le superfici"])};fn.source="brand: ecosmalto per tutte le superfici";return fn;})(),
"description": (()=>{const fn=(ctx) => {const { normalize: _normalize } = ctx;return _normalize(["Linea di ecosmalti per ogni superficie e supporto nata per sostenere la cultura del riciclo e del riuso contro gli sprechi."])};fn.source="Linea di ecosmalti per ogni superficie e supporto nata per sostenere la cultura del riciclo e del riuso contro gli sprechi.";return fn;})()
}
}
}
})
}</pre><br>
at /components/corporate/navbar.vue?vue&type=i18n&index=0&lang.yaml ] {
statusCode: 500,
fatal: false,
unhandled: false,
statusMessage: 'Vite Error',
__nuxt_error: true
}
locale it-IT
[Vue warn]: Unhandled error during execution of setup function
at <LayoutLoader key="default" name="default" hasTransition=true >
[nuxt] error caught during app initialization [[vite-node] [plugin:vite-plugin-vue-inspector] [18] /components/corporate/navbar.vue?vue&type=i18n&index=0&lang.yaml <br><pre>export default function (Component) {
Component.__i18n = Component.__i18n || []
Component.__i18n.push({
"locale": "",
"resource": {
"en-US": {
"menu-path": {
"smalti-universali": (()=>{const fn=(ctx) => {const { normalize: _normalize } = ctx;return _normalize(["/brand/p/smalti-universali"])};fn.source="/brand/p/smalti-universali";return fn;})(),
"fondi-protettivi": (()=>{const fn=(ctx) => {const { normalize: _normalize } = ctx;return _normalize(["/brand/p/fondi-protettivi"])};fn.source="/brand/p/fondi-protettivi";return fn;})(),
"trattamento-legno": (()=>{const fn=(ctx) => {const { normalize: _normalize } = ctx;return _normalize(["/brand/p/trattamento-legno"])};fn.source="/brand/p/trattamento-legno";return fn;})()
}
},
"it-IT": {
"title": (()=>{const fn=(ctx) => {const { normalize: _normalize } = ctx;return _normalize(["Questa è la Pagina di <b data-v-inspector=\"components/corporate/navbar.vue:176:32\">brand</b>"])};fn.source="Questa è la Pagina di <b data-v-inspector=\"components/corporate/navbar.vue:176:32\">brand</b>";return fn;})(),
"seo": {
"title": (()=>{const fn=(ctx) => {const { normalize: _normalize } = ctx;return _normalize(["brand: ecosmalto per tutte le superfici"])};fn.source="brand: ecosmalto per tutte le superfici";return fn;})(),
"description": (()=>{const fn=(ctx) => {const { normalize: _normalize } = ctx;return _normalize(["Linea di ecosmalti per ogni superficie e supporto nata per sostenere la cultura del riciclo e del riuso contro gli sprechi."])};fn.source="Linea di ecosmalti per ogni superficie e supporto nata per sostenere la cultura del riciclo e del riuso contro gli sprechi.";return fn;})()
}
}
}
})
}</pre><br>
at /components/corporate/navbar.vue?vue&type=i18n&index=0&lang.yaml ] {
statusCode: 500,
fatal: false,
unhandled: false,
statusMessage: 'Vite Error',
__nuxt_error: true
}
Currently it re-opends the overview tab:
http://volta.s3.fr-par.scw.cloud/Clean_Shot_2023_02_23_at_17_37_25_2c8a4836ed.mp4
Cannot start nuxt: performance is not defined
at node_modules/.pnpm/registry.npmmirror.com+@nuxt[email protected][email protected]/node_modules/@nuxt/devtools/dist/chunks/module-main.mjs:5196:16
at callEachWith (node_modules/.pnpm/[email protected]/node_modules/hookable/dist/index.mjs:46:5)
at Hookable.callHookWith (node_modules/.pnpm/[email protected]/node_modules/hookable/dist/index.mjs:156:7)
at Hookable.callHook (node_modules/.pnpm/[email protected]/node_modules/hookable/dist/index.mjs:148:17)
at enableModule (node_modules/.pnpm/registry.npmmirror.com+@nuxt[email protected][email protected]/node_modules/@nuxt/devtools/dist/chunks/module-main.mjs:8415:14)
at async normalizedModule (node_modules/.pnpm/registry.npmmirror.com+@nuxt[email protected]/node_modules/@nuxt/kit/dist/index.mjs:167:5)
at async installModule (node_modules/.pnpm/registry.npmmirror.com+@nuxt[email protected]/node_modules/@nuxt/kit/dist/index.mjs:435:15)
at async initNuxt (node_modules/.pnpm/[email protected]_nnbwegkqhupcpxestea3eulahm/node_modules/nuxt/dist/index.mjs:2162:7)
at async load (node_modules/.pnpm/[email protected]/node_modules/nuxi/dist/chunks/dev.mjs:6798:9)
at async Object.invoke (node_modules/.pnpm/[email protected]/node_modules/nuxi/dist/chunks/dev.mjs:6859:5)
at async _main (node_modules/.pnpm/[email protected]/node_modules/nuxi/dist/cli.mjs:51:20)
System: macOS Ventura, MacBook Pro M1 Max
Nuxi 3.2.0
Nuxt 3.2.0 with Nitro 2.2.1
Code:
const contentVer = require$$8['cache-version'].content;
Error:
ERROR [unhandledRejection] Cannot read properties of undefined (reading 'content') 15:59:24
at /Users/larry/.nvm/versions/node/v18.8.0/lib/node_modules/@nuxt/devtools/dist/chunks/index.mjs:11113:48
at ModuleJob.run (node:internal/modules/esm/module_job:193:25)
at async Promise.all (index 0)
at async ESMLoader.import (node:internal/modules/esm/loader:528:24)
at async checkForUpdateOf (/Users/larry/.nvm/versions/node/v18.8.0/lib/node_modules/@nuxt/devtools/dist/chunks/module-main.mjs:8166:21)
at async Promise.all (index 0)
at async checkForUpdates (/Users/larry/.nvm/versions/node/v18.8.0/lib/node_modules/@nuxt/devtools/dist/chunks/module-main.mjs:8184:19)
OS: Mac OS
Package Manager: PNPM
Nuxt Version: 3.2.2
Nuxi Verison: 3.2.2
When switching node versions using nvm
.
In my case I enabled npx nuxi devtools enable
on node 18.7.0 and started the project project. It added the project to the .nuxtrc
file which was fine. It was appending the version devtools path appending path to 18.7.0
global node folder. I switch node versions on a different project to 18.9.0
and ran npx nuxi devtools enable
on my second project. I then ran npx nuxi dev
it then started up and I got a bunch of errors to dependancies that where within the devtools global folder.
I looked at the global .nuxtrc
file and it never appended my project path and didn't change the devtools resolution path it was still pointing to .../18.7.0/node_modules/@nuxt/devtools
. So I deleted the file and re-enabled it and it started working as intended.
I think this is a edge case but I just want to let you know! If you need any information please let me know. I can't really re-produce on stackblitz since it has to be locally with nvm
.
Thanks,
CP
Currently, we are creating a new WS entry to do server-client communication:
devtools/packages/devtools/src/module-main.ts
Lines 58 to 59 in 703b69a
Since Nuxt DevTools is relying on Vite (I see in the near future, we probably only support Vite), I guess reusing Vite's WS would make things more efficient and stable. As Vite has the capability of handling custom events now: vitejs/vite#7437
This could potentially solve the connection issue in back-proxy or dockers, as Vite handles them well. Also could align with the approaches of vite-plugin-inspect etc.
/cc @pi0 you mentioned previously about reusing WS from Nitro, do you think it's still a thing, and what's your opinion on choosing which over which?
On the sidebar:
http://volta.s3.fr-par.scw.cloud/Clean_Shot_2023_01_27_at_11_38_23_cc13505378.mov
If we support ellipsis, I guess we can display the filename at the top of the file,
this will also give us space to add a toggle for word wrap, wdyt?
after running
npx nuxi devtools enable
I'm facing the following error:
Error while requiring module C:/Program Files/nodejs/node_modules/@nuxt/devtools: Error: EISDIR: illegal operation on a directory
on
yarn install / yarn dev ..
ERROR [unhandledRejection] Cannot read properties of undefined (reading 'content') 10:47:05
at ./node_modules/@nuxt/devtools/dist/chunks/index.mjs:11113:48
at ModuleJob.run (node:internal/modules/esm/module_job:195:25) 10:46:20
at async Promise.all (index 0)
at async ESMLoader.import (node:internal/modules/esm/loader:337:24)
at async checkForUpdateOf (./node_modules/@nuxt/devtools/dist/chunks/module-main.mjs:8168:21)
at async Promise.all (index 0)
at async checkForUpdates (./node_modules/@nuxt/devtools/dist/chunks/module-main.mjs:8186:19)
app.error: Error: Page not found: /@vite/client 10:48:49
app.error: Error: Page not found: /@vite/client
Having a play with the module and https://github.com/harlan-zw/nuxt-og-image, and it worked pretty well.
However, the rendered iframe isn't reactive at the moment. To add reactivity the iframe src needs to change based on the users route.
Ideally, there would be a way to hook into changes when the Nuxt payload and/or route changes.
Testing floating on an external application, this error shows:
at http://localhost:3000/__nuxt_devtools__/client/_nuxt/@fs/home/pooya/Code/devtools-poc/node_modules/.pnpm/@[email protected]/node_modules/@nuxtjs/color-mode/dist/runtime/plugin.client.mjs:7:24
at useState (http://localhost:3000/__nuxt_devtools__/client/_nuxt/@fs/home/pooya/Code/devtools-poc/node_modules/.pnpm/[email protected]/node_modules/nuxt/dist/app/composables/state.mjs:19:26)
at http://localhost:3000/__nuxt_devtools__/client/_nuxt/@fs/home/pooya/Code/devtools-poc/node_modules/.pnpm/@[email protected]/node_modules/@nuxtjs/color-mode/dist/runtime/plugin.client.mjs:6:21
at fn (http://localhost:3000/__nuxt_devtools__/client/_nuxt/@fs/home/pooya/Code/devtools-poc/node_modules/.pnpm/[email protected]/node_modules/nuxt/dist/app/nuxt.mjs:116:27)
at callWithNuxt (http://localhost:3000/__nuxt_devtools__/client/_nuxt/@fs/home/pooya/Code/devtools-poc/node_modules/.pnpm/[email protected]/node_modules/nuxt/dist/app/nuxt.mjs:121:12)
at applyPlugin (http://localhost:3000/__nuxt_devtools__/client/_nuxt/@fs/home/pooya/Code/devtools-poc/node_modules/.pnpm/[email protected]/node_modules/nuxt/dist/app/nuxt.mjs:67:29)
at applyPlugins (http://localhost:3000/__nuxt_devtools__/client/_nuxt/@fs/home/pooya/Code/devtools-poc/node_modules/.pnpm/[email protected]/node_modules/nuxt/dist/app/nuxt.mjs:76:11)
at async initApp (http://localhost:3000/__nuxt_devtools__/client/_nuxt/entry.mjs:44:7)
Issue is global helper is not available in SPA mode and causes a fatal error.
I am on Windows OS.
The devtools is not activated on my project even after running the command to enable it.
npx nuxi@latest devtools enable
in a nuxt project on WindowsTHe path written in the ~.nuxtrc
is invalid for Windows
This is an example of the configuration file initiated by the command line
telemetry.enabled=false
modules.0=E:/npm/node_modules/@nuxt/devtools/module.cjs
devtoolsGlobal.projects.0=E:\PROJECT\MyProject
I had to rework the path to my project in ~.nuxtrc
Just replacing backslash \
by slash /
was enought
telemetry.enabled=false
modules.0=E:/npm/node_modules/@nuxt/devtools/module.cjs
devtoolsGlobal.projects.0=E:/PROJECT/MyProject
After the discussion with @atinux
Components
Auto Imports
Payload
Module
Config
Overview
Report for Production
Plugins
Virtual File
Console
Inspector
VS Code
This issue lists Renovate updates and detected dependencies. Read the Dependency Dashboard docs to learn more.
These updates have been manually edited so Renovate will no longer make changes. To discard all commits and start over, click on a checkbox.
@antfu/eslint-config
, @nuxt/module-builder
, @nuxt/ui
, @vue/devtools-applet
, @vue/devtools-core
, @vue/devtools-kit
, esbuild
, floating-vue
)These updates have all been created already. Click a checkbox below to force a retry/rebase of any.
.github/workflows/autofix.yml
actions/checkout v4
actions/setup-node v4
autofix-ci/action ea32e3a12414e6d3183163c3424a7d7a8631ad84
.github/workflows/ci.yml
actions/checkout v4
actions/setup-node v4
.github/workflows/release.yml
actions/checkout v4
actions/setup-node v4
docs/package.json
@iconify-json/ph ^1.1.14
@iconify-json/simple-icons ^1.1.114
@nuxt/content ^2.13.2
@nuxt/devtools 1.3.1
@nuxt/fonts ^0.7.2
@nuxt/image 1.7.0
@nuxt/ui-pro ^1.4.1
@nuxthq/studio ^2.0.3
@nuxtjs/plausible ^1.0.2
@vueuse/core ^11.0.1
@vueuse/nuxt ^11.0.1
nuxt ^3.13.0
nuxt-og-image ^3.0.0-rc.65
@nuxt/ui 2.15.2
package.json
@antfu/eslint-config ^2.27.0
@antfu/ni ^0.22.4
@nuxt/module-builder ~0.6.0
@nuxt/schema ^3.13.0
@types/markdown-it ^14.1.2
@types/node ^22.5.0
@types/which ^3.0.4
@types/ws ^8.5.12
@unocss/eslint-config ^0.62.2
bumpp ^9.5.2
conventional-changelog-cli ^5.0.0
eslint ^9.9.0
eslint-plugin-format ^0.1.2
esno ^4.7.0
lint-staged ^15.2.9
nuxt ^3.13.0
pathe ^1.1.2
simple-git-hooks ^2.11.1
taze ^0.16.6
tiged ^2.12.7
typescript ^5.5.4
ua-parser-js ^1.0.38
unocss ^0.62.2
vite-hot-client ^0.2.3
vue ^3.4.38
vue-tsc ^2.0.29
esbuild ^0.21.5
pnpm 9.8.0
packages/devtools-kit/package.json
@nuxt/kit ^3.13.0
@nuxt/schema ^3.13.0
birpc ^0.2.17
error-stack-parser-es ^0.1.5
hookable ^5.5.3
unbuild ^2.0.0
unimport ^3.11.0
vite-plugin-vue-inspector ^5.1.3
vue-router ^4.4.3
vite *
packages/devtools-ui-kit/package.json
@iconify-json/carbon ^1.1.37
@iconify-json/logos ^1.1.44
@iconify-json/ri ^1.1.22
@iconify-json/tabler ^1.1.120
@nuxt/kit ^3.13.0
@unocss/core ^0.62.2
@unocss/nuxt ^0.62.2
@unocss/preset-attributify ^0.62.2
@unocss/preset-icons ^0.62.2
@unocss/preset-mini ^0.62.2
@unocss/reset ^0.62.2
@vueuse/core ^11.0.1
@vueuse/integrations ^11.0.1
@vueuse/nuxt ^11.0.1
defu ^6.1.4
focus-trap ^7.5.4
splitpanes ^3.1.5
unocss ^0.62.2
v-lazy-show ^0.2.4
nuxt ^3.13.0
packages/devtools-wizard/package.json
consola ^3.2.3
diff ^5.2.0
global-directory ^4.0.1
magicast ^0.3.4
pathe ^1.1.2
pkg-types ^1.2.0
prompts ^2.4.2
rc9 ^2.1.2
semver ^7.6.3
@types/diff ^5.2.1
@types/prompts ^2.4.9
unbuild ^2.0.0
packages/devtools/package.json
@antfu/utils ^0.7.10
@nuxt/kit ^3.13.0
@vue/devtools-core 7.3.3
@vue/devtools-kit 7.3.3
birpc ^0.2.17
consola ^3.2.3
cronstrue ^2.50.0
destr ^2.0.3
error-stack-parser-es ^0.1.5
fast-glob ^3.3.2
fast-npm-meta ^0.2.2
flatted ^3.3.1
get-port-please ^3.1.2
hookable ^5.5.3
image-meta ^0.2.1
is-installed-globally ^1.0.0
launch-editor ^2.8.1
local-pkg ^0.5.0
magicast ^0.3.4
nypm ^0.3.9
ohash ^1.1.3
pathe ^1.1.2
perfect-debounce ^1.0.0
pkg-types ^1.2.0
rc9 ^2.1.2
scule ^1.3.0
semver ^7.6.3
simple-git ^3.25.0
sirv ^2.0.4
unimport ^3.11.0
vite-plugin-inspect ^0.8.7
vite-plugin-vue-inspector ^5.1.3
ws ^8.18.0
@iconify-json/bxl ^1.1.11
@iconify-json/carbon ^1.1.37
@iconify-json/logos ^1.1.44
@iconify-json/ri ^1.1.22
@iconify-json/simple-icons ^1.1.114
@iconify-json/tabler ^1.1.120
@nuxt/content ^2.13.2
@nuxt/test-utils 3.9.0
@parcel/watcher ^2.4.1
@types/markdown-it-link-attributes ^3.0.5
@types/ua-parser-js ^0.7.39
@unocss/nuxt ^0.62.2
@unocss/preset-icons ^0.62.2
@unocss/preset-uno ^0.62.2
@unocss/runtime ^0.62.2
@vitest/ui ^2.0.5
@vue/devtools-applet 7.3.3
@vueuse/nuxt ^11.0.1
@xterm/addon-fit ^0.10.0
@xterm/xterm ^5.5.0
esno ^4.7.0
floating-vue 5.0.2
fuse.js ^7.0.0
json-editor-vue ^0.15.2
markdown-it ^14.1.0
markdown-it-link-attributes ^4.0.1
nanoid ^5.0.7
nitropack ^2.9.7
nuxt ^3.13.0
ofetch ^1.3.4
quicktype-core ^23.0.170
shiki ^1.14.1
theme-vitesse ^0.8.3
ua-parser-js ^1.0.38
unocss ^0.62.2
unplugin-vue-markdown ^0.26.2
vanilla-jsoneditor ^0.23.8
vis-data ^7.1.9
vis-network ^9.1.9
vue-tsc ^2.0.29
vue-virtual-scroller 2.0.0-beta.8
vite *
playgrounds/empty/package.json
@types/node ^22.5.0
nuxt ^3.13.0
playgrounds/module-starter/client/package.json
playgrounds/module-starter/package.json
@nuxt/kit ^3.13.0
sirv ^2.0.4
@iconify-json/carbon ^1.1.37
@nuxt/module-builder ~0.6.0
@nuxt/schema ^3.13.0
@nuxt/test-utils ^3.14.1
eslint ^9.9.0
nuxt ^3.13.0
vitest ^2.0.5
playgrounds/module-starter/playground/package.json
playgrounds/tab-layers/package.json
playgrounds/tab-pinia/package.json
@pinia/nuxt ^0.5.4
@vueuse/core ^11.0.1
pinia ^2.2.2
@exampledev/new.css ^1.1.3
cypress ^13.13.3
nuxt ^3.13.0
playgrounds/tab-seo/package.json
@types/node ^22.5.0
nuxt ^3.13.0
playgrounds/tab-server-route/package.json
@types/node ^22.5.0
nuxt ^3.13.0
playgrounds/tab-timeline/package.json
@types/node ^22.5.0
nuxt ^3.13.0
Noticed while running a lighthouse test on my nuxt app. Seems like the button needs a aria-label?
Probably right here:
Happy to open a pr for this
I would like to see the experience of having this behavior.
As reactivity transform is planned to be removed in the future, should we migrate off of it soon or keep it up for a little longer?
Currently it only disables the component selector:
https://volta.s3.fr-par.scw.cloud/Clean_Shot_2023_02_23_at_18_01_47_6093f1acbb.mp4
I tried to fix it but cannot see where we can re-open the default view size.
Hi ! 👋 on windows i've got an issue to load the devtools. If i remember well, there was an issue similar to this one a few months ago on nuxt 3 RC.
Log:
Failed to load url /@fs/C:/.../AppData/Roaming/nvm/v16.19.0/node_modules/@nuxt/devtools/node_modules/vite-plugin-vue-inspector/src/load.js (resolved id: C:/Users/chakr/AppData/Roaming/nvm/v16.19.0/node_modules/@nuxt/devtools/node_modules/vite-plugin-vue-inspector/src/load.js?v=d01c9f94). Does the file exist?`
Failed to load url /@fs/C:/.../AppData/Roaming/nvm/v16.19.0/node_modules/@nuxt/devtools/dist/runtime/plugins/devtools.client.mjs?v=d01c9f94 (resolved id: C:/Users/chakr/AppData/Roaming/nvm/v16.19.0/node_modules/@nuxt/devtools/dist/runtime/plugins/devtools.client.mjs?v=d01c9f94). Does the file exist?
Windows_NT
v18.14.0
20:24:273.2.0
2.2.1
[email protected]
vite
ssr
, modules
, colorMode
, css
, app
, content
@pinia/[email protected]
, [email protected]
, @nuxtjs/[email protected]
, @nuxt/[email protected]
, @vueuse/[email protected]
, [email protected]
-
npx nuxi@latest devtools enable
on my existing project that was upgraded using npx nuxi upgrade
yarn dev
and then the error came out.I also did yarn upgrade
to make sure all my dependencies is the latest.
Rerun the yarn dev
. yarn dev is working but the nuxt dev tools not working.
So I cannot explain well what really happened but I believe this error will show what happens;
√ Nuxt Devtools is enabled v0.1.2 (experimental) 20:24:30
i nuxt-windicss v2.6.0 running with config: ./windi.config.ts. nuxt-windicss 20:24:31
ERROR Failed to load url /@fs/D:/tools/nvm/v18.14.0/node_modules/@nuxt/devtools/node_modules/vite-plugin-vue-inspector/src/load.js (resolved id: D:/tools/nvm/v18.14.0/node_modules/@nuxt/devtools/node_modules/vite-plugin-vue-inspector/src/load.js?v=c6393dd2). Does the file exist?
ERROR Failed to load url /@fs/D:/tools/nvm/v18.14.0/node_modules/@nuxt/devtools/dist/runtime/plugins/devtools.client.mjs?v=c6393dd2 (resolved id: D:/tools/nvm/v18.14.0/node_modules/@nuxt/devtools/dist/runtime/plugins/devtools.client.mjs?v=c6393dd2). Does the file exist?
No response
No response
hi i am on windows
When started vscode tunnel which is working it tells me its not running
devtools/src/integrations/vscode.ts
Line 11 in 1c0f44c
i am not sure this is the same as code-tunnel on windows
npx which code-tunnel
C:\Users\xxxx\AppData\Local\Programs\Microsoft VS Code\bin\code-tunnel.EXE
Tunnel started link also works:
and anyway thanks for this awesome work
Vscode version:
ok nvm i am not sure code tunnel is the same as a code server oO
List files under public/
, provide simple preview, and drag-n-drop support
I created Nuxt project with version "3.2.0", and I installed nuxt devtools as mentioned on https://github.com/nuxt/devtools.
after that I restarted nuxt app, and tried to press Alt+D, nothing happens and nothing shows in the chrome dev tools
Hi guys,
so i just tested these devtools, but now I cannot disable it anymore.
Even though it says
Nuxt Devtools is not enabled for this project.
I always get
✔ Nuxt Devtools is enabled v0.1.2 (experimental)
Also if i switch to another project which runs on Node 16, I always get Node 18 errors as this was the version i initially installed the devtools.
The request url "/Users/…/.nvm/versions/node/v18.10.0/lib/node_modules/@nuxt/devtools/dist/runtime/plugins/devtools.client.mjs" is outside of Vite serving allow list.
Therefor I cannot use any of my other nuxt3 projects anymore.
How to fix this?
This happens, because both packages injects $nuxtSocket to the context. So, how to use DevTools with nuxt-socket-io in same application?
Hello guys!! What a wonderful work this devtools!!
I just realized that an error is thrown from module html-validator everytime I use nuxt devtools.
It seems there is an issue regarding a validation rule when devtools tries to add data-v-inspector
. I need to use the rule 'no-dup-class': 'off'
in html-validator config. Everytime I set this to off
, the error below happens. Removing this rule the error disappear.
HTML validation errors found for / 19:14:59
error: failed to tokenize "=\"app.vue:...", expected attribute, ">" or "/>" (parser-error) at inline:114:11:
112 | <body>
113 | <div id="__nuxt">
> 114 | <div="app.vue:2:3">
| ^
115 | <!--[-->
My HTML-Validator config is like this:
['@nuxtjs/html-validator', {
usePrettier: true,
logLevel: 'warning',
options: {
rules: {
'no-dup-class': 'off' //I NEED THIS OFF :)
}
}
}],
Thanks in advance for any help on this.
Cheers
The below error is coming when i tried to click on the dev tool icon, it didn't crashed visually but got the below error in terminal,
System: Windows 10,
Nuxi 3.2.0
Nuxt 3.2.0 with Nitro 2.2.1
`ERROR [unhandledRejection] Cannot read properties of undefined (reading 'content') 22:29:25
at/node_modules/@nuxt/devtools/dist/chunks/index.mjs:11113:48
at ModuleJob.run (node:internal/modules/esm/module_job:193:25)
at async Promise.all (index 0)
at async ESMLoader.import (node:internal/modules/esm/loader:530:24)
at async checkForUpdateOf (/C://node_modules/@nuxt/devtools/dist/chunks/module-main.mjs:8166:21)
at async Promise.all (index 0)
at async checkForUpdates (/C://projects/yts/node_modules/@nuxt/devtools/dist/chunks/module-main.mjs:8184:19)`
npm run dev
✔ Nuxt Devtools is enabled v0.1.0 (experimental)
when i open the page on browser,
i see the icon button, click it,
but only black empty box is visable
node v19.5.0
Nuxt 3.2.0 with Nitro 2.2.1
"devDependencies": {
"@nuxt/devtools": "npm:@nuxt/devtools-edge@latest"
}
chrome Version 110.0.5481.77
A declarative, efficient, and flexible JavaScript library for building user interfaces.
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google ❤️ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.