Creating Deno.json wrecks Next.js project
I am trying to create a Next.js project with Deno, Shadcn & Tailwind.
Things initially seem fine until I realise that I need to create a Deno.json file to get
Object.prototype.__proto__ to work.
However as soon as I create a Deno.js file, I am bombarded with numerous errors that I wouldn't (and shouldn't) be getting otherwise - even within Shadcn components.
Initially, these errors are pertaining to imports. If I try to fix them, I start getting 'implict any' errors on all my shadcn components.
Any advise on fixing this is highly appreciated.
21 Replies
To recreate:
(using VSCode as the IDE, not sure if this is IDE specific)
Create a Next.js Project (use all defaults):
deno run -A npm:create-next-app@latest
cd into the project directory and initialize shadcn (you may use all defaults):
deno -A npm:shadcn@latest init
Add something:
deno run -A npm:shadcn@latest add login-03
At this point run the project and glance through code, everything should be fine.
deno task dev
Now create an empty deno.json in the root and save the file.
You'll see a bunch of errors emerge in the IDE, project will work fine if you try to run it.Your ide probably thinks your project is only using deno stuff and not deno + node, you can either fully migrate to deno (transform the package.json to a deno.json) or just delete the not used deno.json
If you're using deno and try to install with a package when you have a package.json, deno will use the package.json instead, so you can just use it like it's deno.json
Thanks for responding @Sun「無用」, I need to create a deno.json to use the 'unsafe-proto' feature flag as Next.js has dependencies that require that.
I ended up upgrading my Deno installation and VS code extension to see if that solves anything and saw the prompt attached popping up - Disabling Deno LSP as per the prompt solved the problem!
but wait, are you using deno in the project?
Yes
that feels a bit weird then :d
is the ide able to resolve imports and autocomplete and stuff like that?
Imports are working as expected, auto complete is missing all the Deno stuff 😦
But Deno specific code is running, and the IDE isn't complaining about it being there - kind of absurd.
I am able to use Deno.env for example
yea, if you just disable deno then it just uses npm and the available node_modules
if the node_modules has a
.deno, it that's the reason
yea, if you're running on deno, you can still use the deno stuffIt doesn't
I'd just fully migrate to a deno.json, from the package.json + tsconfig.json stuff, but that might take some time
is there a cli to convert package.json to deno.json by any chance?
not any that I know of, but that's a project ig
I guess I'll do this then - thanks for the guidance.
I'll take a shot at this using an LLM first I guess, sounds like an apt task for AI 😅
Will do it manually if that doesn't work out
if you want a "more optimized" deno framework, I recommend #fresh
but that's just an opinion at this point
Since this is not a personal project, I don't have much flexibility on the stack unfortunately - but I'll definately check out Fresh at a later point 🙂
feels kinda weird to use next and deno for work, those are weird-ish requirements for now
ig it works though, gl
Some people on the team are very bullish on Deno, plus it's an internal tool so they are willing to take a bet - I've been tasked with setting the initial project up 😅
jr dev?
yep
Did some further research and the way forward seems to be to not use the Deno extension in VSCode for this use case.
Can't fully migrate to a Deno.json as there seem to be a few default compiler options in the project's tscofing that can't be mapped in Deno.json? (can be wrong here)
The workaround seems to be to just add
@types/deno as a dev dependency in package.json (https://www.reddit.com/r/Deno/s/oW20RKgbbI)
Also, had to remove the initial node_modules and package.lock.json and run deno install as the next cli seems to run npm install during the init process.
Things seem good so far with this workaround
Thanks - hopefully this goes well 🤞you can map every config in tsconfig to deno.json, at least that's the expectation
if you can't that's something to report as an issue in their gh
also yea, next runs npm if it doesn't recognize it's being ran from npm/yarn/bun
will look deeper into this then, thanks!