fix(vscode-language-syntax): Add "text.html.vue" as inline injection target#4144
Merged
Conversation
vuejs/language-tools#5856 changed the vue grammar scope from "source.vue" to "text.html.vue". This change simply adds the new scope to the list of inline injection targets. Old scope is still supported for backwards compatibility, tho I am unsure if this is necessary.
🦋 Changeset detectedLatest commit: 3c448f1 The changes in this PR will be included in the next version bump. This PR includes changesets to release 1 package
Not sure what this means? Click here to learn what changesets are. Click here if you're a maintainer who wants to add another changeset to this PR |
|
@dimaMachina could you please have a look into this? For some weeks now all my gql code snippets inside .vue files are not highlighted anymore. Would be awesome if we could get functionality back. |
|
Yeah, this is driving me a little crazy. Please merge this |
|
For reference, if it wasn't clear from what everyone has said so far: This extension no longer works with vue, without this change. Newcomers will not be trying to downgrade their vue extension. They will assume this extension simply doesn't work with vue at all. |
|
Anyone has idea how to return graphql syntax highlighting back to vue files? |
|
You can downgrade the vue extension to 3.0.8 until this is merged |
|
3.1.8 works. I tried them all. And after 3.2.0 no one extension works :( |
|
Correct, that's what this PR fixes, when it gets merged. |
Contributor
|
@jsmnbom can you add a changeset please? Run |
Closed
This was referenced May 8, 2026
This was referenced May 9, 2026
Merged
benjie
pushed a commit
that referenced
this pull request
May 11, 2026
This PR was opened by the [Changesets release](https://github.com/changesets/action) GitHub action. When you're ready to do a release, you can merge this and the packages will be published to npm automatically. If you're not ready to do a release yet, that's fine, whenever you add more changesets to main, this PR will be updated. # Releases ## @graphiql/toolkit@0.12.0 ### Minor Changes - [#4199](#4199) [`463df14`](463df14) Thanks [@trevor-scheer](https://github.com/trevor-scheer)! - Send spec-compliant `Accept` header (`application/graphql-response+json`) in `createSimpleFetcher` ## codemirror-graphql@2.2.5 ### Patch Changes - Updated dependencies \[[`914a547`](914a547), [`10f66d5`](10f66d5)]: - graphql-language-service@5.5.1 ## graphiql@5.2.3 ### Patch Changes - [#4181](#4181) [`f1a210e`](f1a210e) Thanks [@trevor-scheer](https://github.com/trevor-scheer)! - Fix schema prop to skip introspection when IntrospectionQuery data is provided Previously, passing an `IntrospectionQuery` result as the `schema` prop would still trigger a network introspection request. The `shouldIntrospect` check only recognized `GraphQLSchema` instances (via `isSchema`), not raw introspection data. Now, when an `IntrospectionQuery` is passed, a schema is built from it directly using `buildClientSchema` and introspection is skipped. - [#4211](#4211) [`e7b30c1`](e7b30c1) Thanks [@davidjb](https://github.com/davidjb)! - Add \*.css to sideEffects to allow import of CSS in Webpack Javascript - Updated dependencies \[[`f1a210e`](f1a210e), [`6f5d5d2`](6f5d5d2), [`40359eb`](40359eb), [`e7b30c1`](e7b30c1)]: - @graphiql/react@0.37.4 - @graphiql/plugin-doc-explorer@0.4.2 - @graphiql/plugin-history@0.4.2 ## @graphiql/plugin-code-exporter@5.1.2 ### Patch Changes - [#4211](#4211) [`e7b30c1`](e7b30c1) Thanks [@davidjb](https://github.com/davidjb)! - Add \*.css to sideEffects to allow import of CSS in Webpack Javascript ## @graphiql/plugin-doc-explorer@0.4.2 ### Patch Changes - [#4231](#4231) [`6f5d5d2`](6f5d5d2) Thanks [@trevor-scheer](https://github.com/trevor-scheer)! - Fix degraded type declarations in published packages Both packages import from `@graphiql/react` at build time but only declared it as a peer dependency. Yarn workspaces topologically orders builds via `dependencies`/`devDependencies`, not `peerDependencies`, so on a clean checkout these plugins built before `@graphiql/react` had emitted its `dist/*.d.ts`. `vite-plugin-dts` then ran `tsc` against unresolved `@graphiql/react` imports, fell back to `any` for any return type that flowed through `useGraphiQL`, and published `.d.ts` artifacts where hooks like `useDocExplorer` and `useDocExplorerActions` resolved to `() => any` instead of their real shapes. Adding `@graphiql/react` as a `devDependency` matches the pattern already in `@graphiql/plugin-explorer` and `@graphiql/plugin-code-exporter` and lets the build run in topological order. - [#4140](#4140) [`40359eb`](40359eb) Thanks [@trevor-scheer](https://github.com/trevor-scheer)! - Remove `react-compiler-runtime` peer dependency - [#4211](#4211) [`e7b30c1`](e7b30c1) Thanks [@davidjb](https://github.com/davidjb)! - Add \*.css to sideEffects to allow import of CSS in Webpack Javascript ## @graphiql/plugin-explorer@5.1.2 ### Patch Changes - [#4211](#4211) [`e7b30c1`](e7b30c1) Thanks [@davidjb](https://github.com/davidjb)! - Add \*.css to sideEffects to allow import of CSS in Webpack Javascript ## @graphiql/plugin-history@0.4.2 ### Patch Changes - [#4231](#4231) [`6f5d5d2`](6f5d5d2) Thanks [@trevor-scheer](https://github.com/trevor-scheer)! - Fix degraded type declarations in published packages Both packages import from `@graphiql/react` at build time but only declared it as a peer dependency. Yarn workspaces topologically orders builds via `dependencies`/`devDependencies`, not `peerDependencies`, so on a clean checkout these plugins built before `@graphiql/react` had emitted its `dist/*.d.ts`. `vite-plugin-dts` then ran `tsc` against unresolved `@graphiql/react` imports, fell back to `any` for any return type that flowed through `useGraphiQL`, and published `.d.ts` artifacts where hooks like `useDocExplorer` and `useDocExplorerActions` resolved to `() => any` instead of their real shapes. Adding `@graphiql/react` as a `devDependency` matches the pattern already in `@graphiql/plugin-explorer` and `@graphiql/plugin-code-exporter` and lets the build run in topological order. - [#4140](#4140) [`40359eb`](40359eb) Thanks [@trevor-scheer](https://github.com/trevor-scheer)! - Remove `react-compiler-runtime` peer dependency - [#4211](#4211) [`e7b30c1`](e7b30c1) Thanks [@davidjb](https://github.com/davidjb)! - Add \*.css to sideEffects to allow import of CSS in Webpack Javascript - Updated dependencies \[[`463df14`](463df14)]: - @graphiql/toolkit@0.12.0 ## @graphiql/react@0.37.4 ### Patch Changes - [#4181](#4181) [`f1a210e`](f1a210e) Thanks [@trevor-scheer](https://github.com/trevor-scheer)! - Fix schema prop to skip introspection when IntrospectionQuery data is provided Previously, passing an `IntrospectionQuery` result as the `schema` prop would still trigger a network introspection request. The `shouldIntrospect` check only recognized `GraphQLSchema` instances (via `isSchema`), not raw introspection data. Now, when an `IntrospectionQuery` is passed, a schema is built from it directly using `buildClientSchema` and introspection is skipped. - [#4140](#4140) [`40359eb`](40359eb) Thanks [@trevor-scheer](https://github.com/trevor-scheer)! - Remove `react-compiler-runtime` peer dependency - [#4211](#4211) [`e7b30c1`](e7b30c1) Thanks [@davidjb](https://github.com/davidjb)! - Add \*.css to sideEffects to allow import of CSS in Webpack Javascript - Updated dependencies \[[`914a547`](914a547), [`463df14`](463df14), [`4bb7909`](4bb7909), [`10f66d5`](10f66d5)]: - graphql-language-service@5.5.1 - @graphiql/toolkit@0.12.0 - monaco-graphql@1.7.4 ## graphql-language-service@5.5.1 ### Patch Changes - [#3882](#3882) [`914a547`](914a547) Thanks [@bensengupta](https://github.com/bensengupta)! - Fix off-by-one when hovering over token - [#4222](#4222) [`10f66d5`](10f66d5) Thanks [@trevor-scheer](https://github.com/trevor-scheer)! - Unpin and update graphql-config dependency ## graphql-language-service-server@2.14.9 ### Patch Changes - [#4187](#4187) [`ca83879`](ca83879) Thanks [@trevor-scheer](https://github.com/trevor-scheer)! - Bump required TypeScript runtime dependency from `^5.3.3` to `^5.8.0`. This is preparatory work for adopting the TypeScript Native Preview (tsgo) compiler in a follow-up change, which tracks TypeScript 5.8 semantics. In practice `^5.3.3` already resolved to TS 5.8+ for most consumers; the new floor only affects consumers who pin TypeScript to 5.3–5.7 via resolutions or overrides. - [#4222](#4222) [`10f66d5`](10f66d5) Thanks [@trevor-scheer](https://github.com/trevor-scheer)! - Unpin and update graphql-config dependency - Updated dependencies \[[`914a547`](914a547), [`10f66d5`](10f66d5)]: - graphql-language-service@5.5.1 ## monaco-graphql@1.7.4 ### Patch Changes - [#4225](#4225) [`4bb7909`](4bb7909) Thanks [@trevor-scheer](https://github.com/trevor-scheer)! - Fix hover crashing on the first line of a query `GraphQLWorker.doHover` was passing 0-indexed positions to `getRange`, which expects a 1-indexed `SourceLocation` (per the GraphQL spec). On the first line this caused `Expected Parser stream to be available` to be logged and hover to return `null`. On other lines it returned the range of the previous line's last token rather than the token under the cursor. Use `getTokenAtPosition` to compute the actual token range instead. - Updated dependencies \[[`914a547`](914a547), [`10f66d5`](10f66d5)]: - graphql-language-service@5.5.1 ## vscode-graphql@0.13.3 ### Patch Changes - [#4183](#4183) [`2ef9389`](2ef9389) Thanks [@trevor-scheer](https://github.com/trevor-scheer)! - Fix VS Code extension publishing scripts - Updated dependencies \[[`ca83879`](ca83879), [`10f66d5`](10f66d5)]: - graphql-language-service-server@2.14.9 ## vscode-graphql-execution@0.3.3 ### Patch Changes - [#4183](#4183) [`2ef9389`](2ef9389) Thanks [@trevor-scheer](https://github.com/trevor-scheer)! - Fix VS Code extension publishing scripts - [#4222](#4222) [`10f66d5`](10f66d5) Thanks [@trevor-scheer](https://github.com/trevor-scheer)! - Unpin and update graphql-config dependency ## vscode-graphql-syntax@1.3.9 ### Patch Changes - [#4183](#4183) [`2ef9389`](2ef9389) Thanks [@trevor-scheer](https://github.com/trevor-scheer)! - Fix VS Code extension publishing scripts - [#4143](#4143) [`7979bf5`](7979bf5) Thanks [@Netail](https://github.com/Netail)! - Add syntax highlighting support for subscription operations. - [#4144](#4144) [`f7e2a56`](f7e2a56) Thanks [@jsmnbom](https://github.com/jsmnbom)! - Add `text.html.vue` as inline injection target. [This PR](vuejs/language-tools#5856) broke tooling by changing the vue grammar scope from `source.vue` to `text.html.vue`. This adds `text.html.vue` as an additional injection target for GraphQL syntax highlighting so that it works in both cases. Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
5 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
vuejs/language-tools#5856 changed the vue grammar scope from "source.vue" to "text.html.vue". This change simply adds the new scope to the list of inline injection targets. Old scope is still supported for backwards compatibility, tho I am unsure if this is necessary.