Commit activity
Last 12 weeks · 16 commits
Community health
2 of 6 standards met
37
✓README✓License○Contributing○Code of Conduct○Issue Template○PR Template
Recent PRs & issues
Active · Last activity 7h ago
See all on GitHub →Vue DevTools 6 had settings and , both defaulting to . Currently, these settings appear in the types for Vue DevTools 8 but they don't actually do anything. I don't know whether anyone actually uses these settings, but Vue DevTools 8 currently behaves as though they are set to , which is different from version 6. The code that implemented these settings in v6 is: They are also documented at: This difference from v6 has led to some problems in Vue Router and Pinia when working with multiple applications on the same page. A couple of notes on my implementation: I couldn't figure out how to get the types to behave, so I've resorted to in a couple of places. If anyone has a better suggestion please let me know. I've checked , which is slightly different from how v6 did it (using ). I'm not sure if this makes a difference, it seemed to work fine in my testing. I checked various libraries to see how they use . Some aren't using v8 yet, but Vue Router, Pinia and VitePress are notable examples that are. I've outlined the problems with those libraries below. This PR should fix these problems. Vue Router It's possible to have multiple apps with multiple routers on a page using . Vue Router's integration with the DevTools is here: This makes 4 calls to hooks. Two of them are checking , two aren't. The two that aren't lead to problems. The tags are duplicated and there are multiple entries. If we don't fix this in Vue DevTools then it'll need to be fixed in Vue Router instead. Pinia DevTools integration is here: There are 5 calls and two are missing the . I'm unclear what the call to actually does. I haven't been able to find where this gets triggered in the DevTools. But from looking at how Pinia uses it, it looks like adding would be harmless and might even be necessary to ensure it updates the correct instance. The other is , which leads to duplication in the DevTools: Again, if we don't fix this in Vue DevTools then it'll need to be fixed in Pinia instead. VitePress VitePress is using v8. The code for its integration is at: That isn't checking , which can lead to properties being injected in the wrong app.
Recent fixes
Very unexpectedly, this morning the Vue app I was developing started failing after I've renamed a component, and then even reverting all changes it continued failing. After debugging deeper, I've found the inject keys for the component (which come from a mixin, the component references the mixin and the mixin contains "inject") weren't containing the expected value. I've used a Proxy() to catch who was writing to the "inject" arrays, and it seemed to be this plugin 🤯 This stacktrace shows the plugin source code calling Object.assign on my app data Due to restrictions I can't share codebase or an usable demo of the app, but hope those screenshots help bring context and maybe reproduce, component uses two mixins and each one of them brings an inject array which Vue combines together.
Structured data for AI agents
Repository: vuejs/devtools. Description: ⚙️ Browser devtools extension for debugging Vue.js applications. Stars: 2771, Forks: 242. Primary language: TypeScript. Languages: TypeScript (75.7%), Vue (22.4%), HTML (1%), CSS (0.6%), JavaScript (0.2%). License: MIT. Homepage: https://devtools.vuejs.org/ Latest release: v8.0.6 (3w ago). Open PRs: 32, open issues: 178. Last activity: 7h ago. Community health: 37%. Top contributors: webfansplz, alexzhang1030, renovate[bot], Azurewarth0920, skirtles-code, LoTwT, JianJroh, yyx990803, btea, xuzuodong and others.