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

fix(trpc): avoid hard coding of host/port by using $fetch/fetch when … #639

Merged
merged 1 commit into from
Sep 14, 2023

Conversation

goetzrobin
Copy link
Member

…available

currently you need to know the host and port of the application in order to hard code the trpc endpoint. this is an issue if you want to pre-render a route calling a trpc endpoint, because during pre-rendering the application does not run on the same host/port as in dev.
To address this issue we can simply use the $fetch provided by nitro when its available and fall back to the default fetch when it is not. This has a couple benefits:

  1. you do no longer have to know the host/port, but can simply use /api/trpc, etc. as your endpoint
  2. pre-rendering now works as expected as we query the correct nitro server

Closes #468

PR Checklist

Please check if your PR fulfills the following requirements:

PR Type

What kind of change does this PR introduce?

  • Bugfix
  • Feature
  • Code style update (formatting, local variables)
  • Refactoring (no functional changes, no api changes)
  • Build related changes
  • CI related changes
  • Documentation content changes
  • Other... Please describe:

Which package are you modifying?

  • vite-plugin-angular
  • vite-plugin-nitro
  • astro-angular
  • create-analog
  • router
  • platform
  • content
  • nx-plugin
  • trpc

What is the current behavior?

currently you need to know the host and port of the application in order to hard code the trpc endpoint. this is an issue if you want to pre-render a route calling a trpc endpoint, because during pre-rendering the application does not run on the same host/port as in dev.

Closes #468

What is the new behavior?

To address this issue we can simply use the $fetch provided by nitro when its available and fall back to the default fetch when it is not. This has a couple benefits:

  1. you do no longer have to know the host/port, but can simply use /api/trpc, etc. as your endpoint
  2. pre-rendering now works as expected as we query the correct nitro server

Does this PR introduce a breaking change?

  • Yes
  • No

Other information

[optional] What gif best describes this PR or how it makes you feel?

…available

currently you need to know the host and port of the application in order to
hard code the trpc endpoint. this is an issue if you want to pre-render a route
calling a trpc endpoint, because during pre-rendering the application does not
run on the same host/port as in dev.
To address this issue we can simply use the $fetch provided by nitro when its available
and fall back to the default fetch when it is not.
This has a couple benefits:
1. you do no longer have to know the host/port, but can simply use /api/trpc, etc. as your endpoint
2. pre-rendering now works as expected as we query the correct nitro server

Closes #468
@netlify
Copy link

netlify bot commented Sep 11, 2023

Deploy Preview for analog-blog ready!

Name Link
🔨 Latest commit eb3b6af
🔍 Latest deploy log https://app.netlify.com/sites/analog-blog/deploys/64ff5a5ad2536900086b1394
😎 Deploy Preview https://deploy-preview-639--analog-blog.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify site configuration.

@netlify
Copy link

netlify bot commented Sep 11, 2023

Deploy Preview for analog-docs ready!

Name Link
🔨 Latest commit eb3b6af
🔍 Latest deploy log https://app.netlify.com/sites/analog-docs/deploys/64ff5a5a7fde590008ee3e77
😎 Deploy Preview https://deploy-preview-639--analog-docs.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify site configuration.

@netlify
Copy link

netlify bot commented Sep 11, 2023

Deploy Preview for analog-app ready!

Name Link
🔨 Latest commit eb3b6af
🔍 Latest deploy log https://app.netlify.com/sites/analog-app/deploys/64ff5a5a5cfc1b0008b89f4b
😎 Deploy Preview https://deploy-preview-639--analog-app.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify site configuration.

@brandonroberts brandonroberts merged commit a30ac8a into main Sep 14, 2023
22 checks passed
@brandonroberts brandonroberts deleted the custom-fetch-trpc branch September 14, 2023 03:40
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

using tRPC in constructor or ngOnInit causes build getting stuck
2 participants