H
Hono•2mo ago
Josh

Question on vite build with node server

Hey, I'm new to using hono and I was trying to make a production build with vite using the vite-build plugin but whenever I run it none of the env variables will load. For dev I was injecting them with the dotenv-cli within the package.json scripts, but no matter what I do I cannot get them to work after making a vite build. after the build i'm using the node "./dist/index.js" command but when logging the process.env variable there is nothing in there when compared to dev. I'm going to test out trying to deploy this today with wrangler/cloudflare but I was just experimenting and trying to get the build to run locally for testing but nothing was working.
30 Replies
Josh
JoshOP•2mo ago
So mini update. I refactored the app to use wrangler + cloudflare and I can inject the wrangler.toml vars onto the context on both dev + deployed server no problem. Still unsure why I can't add environment vars to vite build and think I'm just going to skip the node server for now.
ambergristle
ambergristle•2mo ago
what do you mean when you say that you "can't add environment vars to vite build"? which env was getting hit when running the built app? do you have an .env or .env.production?
Josh
JoshOP•2mo ago
I had just a single .env file. The dev script worked fine, but whenever I built the app nothing was showing on either process.env or the vite specific import.meta.env object. These were the scripts (this was also in a turbo/monorepo if that makes a difference):
"dev:node": "dotenv -e ../../.env -- tsx watch src/index.ts",
"start": "dotenv -e ../../.env -- node dist/index.js",
"dev:node": "dotenv -e ../../.env -- tsx watch src/index.ts",
"start": "dotenv -e ../../.env -- node dist/index.js",
ambergristle
ambergristle•2mo ago
i've never used turbo before, but at a glance it seems like it could make a huge difference: https://turbo.build/repo/docs/crafting-your-repository/using-environment-variables sorry i can't be more help. this doesn't seem like a hono-related issue though
Josh
JoshOP•2mo ago
Yeah, theres just not a lot of docs on the @hono/vite-build repo once the package is built. TBH I kind of gave up and just set it up as a cloudflare worker with wrangler and everything is working.
ambergristle
ambergristle•2mo ago
lol. i feel it
Josh
JoshOP•2mo ago
TY for trying to help though 🙂
ambergristle
ambergristle•2mo ago
i tried messing around w it and threw in the towel i think the focus is on honox rn i'm still not sold on hono as part of a full-stack app i'm building a url shortener w hono, but i'm just serving raw html + a bit of client js
Josh
JoshOP•2mo ago
Hm interesting, I'm just getting into hono, I mainly wanted it for rpc + openapi spec generation. Too many meta frameworks to keep up with
ambergristle
ambergristle•2mo ago
hono's jsx and rendering helpers are clutch here. if i needed a proper full-stack app though, i feel like i'd turn to something like remix
Josh
JoshOP•2mo ago
remix has been my goto lately. really like the loader/action patterns.
ambergristle
ambergristle•2mo ago
lmfao. same, tbh. i like that hono motivates me to build slim apps. i think it really shines as a lightweight backend sick. i haven't used it yet, but it's next on my list
Josh
JoshOP•2mo ago
yeah i got next.js fatigue from all the new features and was tired of keeping up with everything
ambergristle
ambergristle•2mo ago
too real app router feels so half-baked
Josh
JoshOP•2mo ago
I think if I had to pick up a new meta framework, it would be tanstack start. everything Tanner publishes just works.
ambergristle
ambergristle•2mo ago
interesting. i had no idea they came out w a framework
Josh
JoshOP•2mo ago
yes its also pretty new
ambergristle
ambergristle•2mo ago
i really like react-query, and react-table seemed cool the idea of tanstack makes me kind of apprehensive though as their funding has grown, so has their scope/appetite it's great to see solid projects/toolkits take off, but i think there's a tendency in tech (when money gets involved) to start building ecosystems and the line between rich ecosystems and walled gardens can get fuzzy, as we see w facebook or vercel
Josh
JoshOP•2mo ago
yeah we will see what happens with it. I'm waiting for it to be out of beta before I even try it. yes - vercel with a bunch of next.js features locked behind it was also a big turnoff for me.
ambergristle
ambergristle•2mo ago
i was really bummed to see them swallow svelte have you tried solid? i've been meaning to try it out. seems like it could be a good option, though idk whether it's compatible w any metaframeworks
Josh
JoshOP•2mo ago
i haven't tried solid or svelte yet. If I had to pick I would probably try svelte first.
ambergristle
ambergristle•2mo ago
why is that? (i've already tried svelte too, so ig i'm following the same order, lol)
Josh
JoshOP•2mo ago
I think its just a time vs. reward balancing on my side. Remix works well for most of the project I do, and I've been doing some shopify app development which is all based on remix now, so learning another meta framework is low on my priority list currently unless I have a specific use case.
ambergristle
ambergristle•2mo ago
i meant more why svelte over solid
Josh
JoshOP•2mo ago
Ah, I think last time I had looked, solid was very similar to react in terms of api and jsx, and svelte is more web native without the jsx.
ambergristle
ambergristle•2mo ago
gotcha. the syntax does seem a lot closer to react, and it does lean more heavily on jsx i tried svelte/kit and found it pretty difficult to wrap my head around and i found the community pretty intolerant towards requests for help/folks that weren't totally on the bandwagon the discords for shadcn/svelte and formsnap/superforms were especially toxic the underlying value prop is really compelling. i really like what they're trying to do with bundles. the metaframework stuff i'm less jazzed on, but i can deal w it maybe i'm not comfortable enough w web standards/still suffering from react brain but i've put svelte on the back-burner. the barrier to entry was too high for me, esp considering that i'm not sold on the patterns they chose for state
Josh
JoshOP•2mo ago
yes its very different than react. the main reason I'm even interested in it is to help keep up with web standards/vanilla js
ambergristle
ambergristle•2mo ago
definitely appealing svelte promises to fill a very real gap in web dev but i haven't been able to get on board yet despite my best efforts
Josh
JoshOP•2mo ago
I would highly recommend some of Scott's tutorials. Ive gone through some of his other courses and they were pretty good, and it looks like his entire video library is free now, it used to require a subscription. I know he really likes svelte and the levelup website itself is written in svelte. https://levelup.video/library?tags=svelte#library-grid
Level Up Tutorials - Learn modern web development
Learn modern web development with Level Up Tutorials. We teach you the latest web technologies, frameworks, and libraries.
ambergristle
ambergristle•2mo ago
word; much obliged! i'll give it a look. i have an app i built in svelekit tha needs some enhancements. i was going to refactor into solid, but maybe i'll give svelte another go

Did you find this page helpful?