-
Notifications
You must be signed in to change notification settings - Fork 1.3k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
@graphql-codegen/client-preset-swc-plugin adds imports before "use client" #9445
Comments
I tried it out with using |
@BowlingX By " Yeah, that should probably insert the import statement after the first The code should probably check |
When adding a "use client" directive to a module, it must come before any other expressions. Instead of always inserting import declarations as the first item, the SWC plugin now checks if the first expression in a module's body is a "use client" directive and inserts its imports after it, if that's the case. Closes: dotansimha#9445
When adding a "use client" directive to a module, it must come before any other expressions. Instead of always inserting import declarations as the first item, the SWC plugin now checks if the first expression in a module's body is a "use client" directive and inserts its imports after it, if that's the case. Closes: dotansimha#9445
When adding a "use client" directive to a module, it must come before any other expressions. Instead of always inserting import declarations as the first item, the SWC plugin now checks if the first expression in a module's body is a "use client" directive and inserts its imports after it, if that's the case. Closes: dotansimha#9445
When adding a "use client" directive to a module, it must come before any other expressions. Instead of always inserting import declarations as the first item, the SWC plugin now checks if the first expression in a module's body is a "use client" directive and inserts its imports after it, if that's the case. Closes: dotansimha#9445
Which packages are impacted by your issue?
@graphql-codegen/cli, @graphql-codegen/client-preset
Describe the bug
@graphql-codegen/client-preset-swc-plugin
inserts imports at the top of modules where you define queries. This breaks modules that are defined as React client components using the "use client" directive, which must appear at the top of the file - because the inserted imports end up before the directive.This means you cannot define GraphQL queries in the same module as a client component when using the Next.js app directory.
Please see the example repository for a reproduction.
Your Example Website or App
https://github.com/victorandree/graphql-code-generator-swc-app-dir
Steps to Reproduce the Bug or Issue
"use client"
directive at the top of the module.The build will fail with a message like the following:
Expected behavior
Since "use client" is required to be at the top of the file by the React Server Components RFC, I expect the SWC plugin to insert its imports after this directive.
Expressed differently: I expect to be able to define GraphQL queries in client components.
Screenshots or Videos
No response
Platform
graphql
version: 16.6.0@graphql-codegen/cli
: 3.3.1@graphql-codegen/client-preset
: 3.0.1@graphql-codegen/client-preset-swc-plugin
: 0.2.0Codegen Config File
Additional context
A workaround is to define queries in a separate file, and import them in the client component. This is a bit annoying.
I'm not super-experienced in reading Rust, but I'm pretty sure that the imports are inserted by the plugin by
module.body.insert(0, [...])
inlib.rs:183
. I'm not sure if there's a simple way to insert it "a bit later" if there's a "use client" directive there.Note: The SWC plugin crashes with the latest version of Next (13.4.3).
The text was updated successfully, but these errors were encountered: