Skip to content
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

Detect server imports on the client #2067

Open
infomiho opened this issue May 27, 2024 · 3 comments · May be fixed by #2442
Open

Detect server imports on the client #2067

infomiho opened this issue May 27, 2024 · 3 comments · May be fixed by #2442
Assignees

Comments

@infomiho
Copy link
Contributor

infomiho commented May 27, 2024

Users sometimes import server specific code from wasp/server/* on the client and it's hard to debug. It's not obvious to new users that this is not something they shouldn't do since their IDE recommended the import.

Possible solution

We should tell the users "Hey you imported something from the server" in their browser.

It can be solved with a simple Vite plugin:

{
  name: "detect-server-imports-on-client",
  transform(code, id) {
    const isInDotWaspFolder = id.includes(".wasp");

    if (isInDotWaspFolder) {
      // Skip checking files in .wasp folder.
      return;
    }

    const codeContainsServerImport = code.includes("wasp/server");

    if (codeContainsServerImport) {
      throw new Error(
        `File ${id} contains a server import. This is not allowed in the client code.`
      );
    }
  },
}

Recent Discord thread: https://ptb.discord.com/channels/686873244791210014/1244030234274168944/1244625849135665244

@infomiho infomiho added the vite label May 27, 2024
@Martinsos Martinsos added the dx label May 29, 2024
@Martinsos
Copy link
Member

Another example of confusion that could have been avoided by implementing this: https://discord.com/channels/686873244791210014/1247941700572414033/1254123386867552417 .

@infomiho
Copy link
Contributor Author

infomiho commented Aug 8, 2024

Another slightly different example: https://ptb.discord.com/channels/686873244791210014/1271071812943478824/1271071812943478824

The user got bit by process variable only available in Node.js. We could maybe also write a heuristic for that e.g. if process.env is detected in some client code - let the users know either via a warning or an error that it's not allowed.

@infomiho
Copy link
Contributor Author

One thing we could also detect is if users are using enum values on the client: https://ptb.discord.com/channels/686873244791210014/1286341107235553420/1291715465034334228

@infomiho infomiho self-assigned this Oct 24, 2024
@infomiho infomiho linked a pull request Jan 9, 2025 that will close this issue
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging a pull request may close this issue.

2 participants