aboutsummaryrefslogtreecommitdiff
path: root/packages/bun-macro-relay
diff options
context:
space:
mode:
authorGravatar Jarred Sumner <jarred@jarredsumner.com> 2023-06-01 00:19:33 -0700
committerGravatar GitHub <noreply@github.com> 2023-06-01 00:19:33 -0700
commita4ccd4e0b4cc19f534bf639f30b7e4218400e1e8 (patch)
tree250f89bddd6e6c920645db2ad39bb7edf576edf0 /packages/bun-macro-relay
parentcb0f76aa73f6b85667b57015a77ac39d9c78aa0b (diff)
parent689434e012a47b9be897f6d90d6aa211b13dfc19 (diff)
downloadbun-jarred/port.tar.gz
bun-jarred/port.tar.zst
bun-jarred/port.zip
Merge branch 'main' into jarred/portjarred/port
Diffstat (limited to 'packages/bun-macro-relay')
-rw-r--r--packages/bun-macro-relay/README.md123
-rw-r--r--packages/bun-macro-relay/__generated__/FooOperation.graphql.ts3
-rw-r--r--packages/bun-macro-relay/bun-macro-relay.tsx79
-rwxr-xr-xpackages/bun-macro-relay/bun.lockbbin1166 -> 0 bytes
-rw-r--r--packages/bun-macro-relay/package.json15
-rw-r--r--packages/bun-macro-relay/test/foo.tsx11
-rw-r--r--packages/bun-macro-relay/tsconfig.json6
7 files changed, 0 insertions, 237 deletions
diff --git a/packages/bun-macro-relay/README.md b/packages/bun-macro-relay/README.md
deleted file mode 100644
index 157163af5..000000000
--- a/packages/bun-macro-relay/README.md
+++ /dev/null
@@ -1,123 +0,0 @@
-# bun-macro-relay
-
-This lets you use Facebook's [Relay](https://github.com/facebook/relay) framework (GraphQL) with bun.
-
-Specifically, this implements the bun equivalent of [`babel-plugin-relay`](https://github.com/facebook/relay/tree/main/packages/babel-plugin-relay). It parses `graphql` queries, but does not compile/save them to your artifacts directory, you still need [`relay-compiler`](https://github.com/facebook/relay/tree/main/packages/relay-compiler) for that.
-
-## Installation
-
-```
-npm install -D bun-macro-relay
-```
-
-## Usage
-
-With three lines in your project's `bunfig.toml`, `react-relay` works automatically with bun.
-
-Add this to your `bunfig.toml`:
-
-```toml
-[macros]
-react-relay = {graphql = "bun-macro-relay"}
-relay-runtime = {graphql = "bun-macro-relay"}
-```
-
-This tells bun to automatically pretend every import statement to `react-relay` with a `graphql` import came from `macro:bun-macro-relay/bun-macro-relay.tsx`.
-
-Effectively, it applies this diff in-memory so you can use `bun-macro-relay` without making other changes to your code:
-
-```js
-// bun will remap this import:
-import { graphql } from "react-relay";
-
-// To this:
-import { graphql } from "macro:bun-macro-relay/bun-macro-relay.tsx";
-```
-
-You can still use the other imports from `react-relay`. It only affects the `graphql` export from `react-relay`.
-
-```js
-// bun will remap this import:
-import { graphql, useFragment } from "react-relay";
-
-// To this:
-import { graphql } from "macro:bun-macro-relay/bun-macro-relay.tsx";
-import { useFragment } from "react-relay";
-```
-
-Ultimately, the `graphql` import should no longer appear in transpiled output:
-
-```js
-import { useFragment } from "react-relay";
-```
-
-If you'd rather not modify your project's `package.json`, you can do this instead:
-
-```js
-import { graphql } from "macro:bun-macro-relay";
-```
-
-## Configuration
-
-For performance reasons, `bun-macro-relay` does not read `relay-config`. That means your Relay configuration will _not_ be honored.
-
-Fortunately, the only configuration option relevant to `bun-macro-relay` is modifying the artifacts directory (the directory where `relay-compiler` saves compiled `.graphql` files).
-
-You can still change that with `bun-macro-relay`.
-
-### Changing the artifacts directory
-
-Pass the `BUN_MACRO_RELAY_ARTIFACT_DIRECTORY` environment variable to bun:
-
-```bash
-BUN_MACRO_RELAY_ARTIFACT_DIRECTORY="__generated__" bun
-```
-
-You can also save it in `.env`, `.env.local`, or `.env.dev`. The path should be relative to the directory containing the project's package.json without a leading `.` or `./`. You can also pass it an absolute path.
-
-## What does `bun-macro-relay` actually do?
-
-1. Parses GraphQL (using the same `graphql` npm package as babel-plugin-relay)
-2. Injects an import to the correct compiled GraphQL file in the Relay artifacts directory
-3. Replaces the use of the `graphql` template literal with the `default` import from the compiled GraphQL file.
-
-Here's an example.
-
-Input:
-
-```tsx
-import { graphql, useLazyLoadQuery } from "react-relay";
-
-const Tweet = () => {
- const data = useLazyLoadQuery(
- graphql`
- query TweetQuery {
- ...Tweet_tweet
- }
- `,
- {}
- );
- if (!data.tweet) return null;
- return <TweetComponent tweet={data.tweet} />;
-};
-```
-
-Output:
-
-```jsx
-import TweetQuery from "../__generated__/TweetQuery.graphql.ts";
-import { useLazyLoadQuery } from "react-relay";
-
-const Tweet = () => {
- const data = useLazyLoadQuery(TweetQuery, {});
- if (!data.tweet) return null;
- return <TweetComponent tweet={data.tweet} />;
-};
-```
-
-bun automatically transpiles JSX & TypeScript, but that's not relevant to this example.
-
-### What does `bun-macro-relay` not do?
-
-1. This first version doesn't hash the contents of the `graphql` query, so it won't detect when the GraphQL query is out of sync with the compiled `.graphql` file in development. However, if you're running Relay's CLI, bun's hot module reloading will automatically update. As long as you run Relay's CLI, it shouldn't matter. This will be fixed eventually (have to expose a native MD5 hashing function)
-2. Compile GraphQL. You still need to use `relay-compiler` for that.
diff --git a/packages/bun-macro-relay/__generated__/FooOperation.graphql.ts b/packages/bun-macro-relay/__generated__/FooOperation.graphql.ts
deleted file mode 100644
index 4c83371c9..000000000
--- a/packages/bun-macro-relay/__generated__/FooOperation.graphql.ts
+++ /dev/null
@@ -1,3 +0,0 @@
-export class FooOperation {}
-
-export default FooOperation;
diff --git a/packages/bun-macro-relay/bun-macro-relay.tsx b/packages/bun-macro-relay/bun-macro-relay.tsx
deleted file mode 100644
index f7899698d..000000000
--- a/packages/bun-macro-relay/bun-macro-relay.tsx
+++ /dev/null
@@ -1,79 +0,0 @@
-import { parse, print } from "graphql/index.js";
-import { resolve } from "path";
-
-//
-// 1. Parse the GraphQL tag.
-// 2. From the parsed GraphQL query, get the AST definition.
-// 3. From the AST definition, inject an import to that file inside the artifact directory
-// 4. (TODO) MD5 the printed source text
-// 5. (TODO) At runtime, if md5 !== import.md5, then warn the user that the query has changed
-// but the file hasn't been updated so it must be reloaded.
-// 6. Replace the TemplateLiteral with the default identifier from the injected import
-let artifactDirectory: string = `__generated__`;
-
-const { RELAY_ARTIFACT_DIRECTORY, BUN_MACRO_RELAY_ARTIFACT_DIRECTORY } =
- Bun.env;
-
-if (RELAY_ARTIFACT_DIRECTORY) {
- artifactDirectory = RELAY_ARTIFACT_DIRECTORY;
-}
-
-if (BUN_MACRO_RELAY_ARTIFACT_DIRECTORY) {
- artifactDirectory = BUN_MACRO_RELAY_ARTIFACT_DIRECTORY;
-}
-
-artifactDirectory = resolve(artifactDirectory);
-
-export function graphql(node) {
- let query;
-
- if (node instanceof <call />) {
- query = node.arguments[0].toString();
- } else if (node instanceof <template />) {
- query = node.toString();
- }
-
- if (typeof query !== "string" || query.length === 0) {
- throw new Error("BunMacroRelay: Unexpected empty graphql string.");
- }
-
- const ast = parse(query);
-
- if (ast.definitions.length === 0) {
- throw new Error("BunMacroRelay: Unexpected empty graphql tag.");
- }
-
- const definition = ast.definitions[0];
-
- if (
- definition.kind !== "FragmentDefinition" &&
- definition.kind !== "OperationDefinition"
- ) {
- throw new Error(
- `BunMacroRelay: Expected a fragment, mutation, query, or subscription, got "${definition.kind}"`,
- );
- }
-
- const graphqlDefinition = definition;
-
- const definitionName = graphqlDefinition.name && graphqlDefinition.name.value;
- if (!definitionName) {
- throw new Error("GraphQL operations and fragments must contain names");
- }
-
- const identifiername = `${definitionName}_$gql`;
-
- const importStmt = (
- <import
- default={identifiername}
- path={`${artifactDirectory}/${definitionName}.graphql`}
- />
- );
-
- return (
- <>
- <inject>{importStmt}</inject>
- <id to={importStmt.namespace[identifiername]} pure />
- </>
- );
-}
diff --git a/packages/bun-macro-relay/bun.lockb b/packages/bun-macro-relay/bun.lockb
deleted file mode 100755
index 03fefa6d0..000000000
--- a/packages/bun-macro-relay/bun.lockb
+++ /dev/null
Binary files differ
diff --git a/packages/bun-macro-relay/package.json b/packages/bun-macro-relay/package.json
deleted file mode 100644
index 772fd5f1c..000000000
--- a/packages/bun-macro-relay/package.json
+++ /dev/null
@@ -1,15 +0,0 @@
-{
- "name": "bun-macro-relay",
- "version": "0.1.2",
- "module": "bun-macro-relay.tsx",
- "license": "MIT",
- "peerDependencies": {
- "graphql": "^15.0.0"
- },
- "devDependencies": {
- "graphql": "^15.6.0"
- },
- "files": [
- "bun-macro-relay.tsx"
- ]
-}
diff --git a/packages/bun-macro-relay/test/foo.tsx b/packages/bun-macro-relay/test/foo.tsx
deleted file mode 100644
index fbb54f551..000000000
--- a/packages/bun-macro-relay/test/foo.tsx
+++ /dev/null
@@ -1,11 +0,0 @@
-import { graphql } from "react-relay";
-
-export const Foo = () => {
- const definition = graphql`
- query FooOperation {
- foo
- }
- `;
-
- return <div>{definition.operation.name}</div>;
-};
diff --git a/packages/bun-macro-relay/tsconfig.json b/packages/bun-macro-relay/tsconfig.json
deleted file mode 100644
index 19d4ac2e6..000000000
--- a/packages/bun-macro-relay/tsconfig.json
+++ /dev/null
@@ -1,6 +0,0 @@
-{
- "compilerOptions": {
- "baseUrl": ".",
- "paths": {}
- }
-}