winglang / wing

A programming language for the cloud ☁️ A unified programming model, combining infrastructure and runtime code into one language ⚡
https://winglang.io
Other
5.02k stars 198 forks source link

@winglibs/vite use native environment variables vs global wing object #7101

Open boyney123 opened 1 month ago

boyney123 commented 1 month ago

Use Case

I'm building an application and trying to share the API URL.

bring cloud;
bring vite;

let freinds: Array<Json> = [
  {name: "John", email: "test@test.com"},
  {name: "John", email: "random@test.com"},
];

let api = new cloud.Api();

api.get("/friends", inflight () => {
  return cloud.ApiResponse {
    body: Json.stringify(freinds)
  };
});

// Create the website

let website = new vite.Vite(
  root: "../ui",
  publicEnv: {
    API_URL: api.url,
  },
);

In the vite code I have to access this using window.wing.env but vite has it's own eco system and ways to share public ENV variables, it would be nice to support this. So Front end developers don't have to care about a wing global object, they continue to write applications as they were.

Proposed Solution

Let me just use Vite import syntax to get what I want https://vitejs.dev/guide/env-and-mode

For example import.meta.env gives me all the environment variables, I would expected to see it on there import.meta.env.API_URL in this example.

Implementation Notes

No response

Component

No response

Community Notes

boyney123 commented 1 month ago

Also curious, if building server side rendered applications with Vite, then the window object will not be there, so wondering how this would, I need to dive deeper, but this is a note for future Dave