Chapters
00:00 - The GetCourses Action
01:08 - Courses Index Route Handler
01:44 - Defining the Courses Index Route
02:26 - The Vue Courses Index Page
04:06 - Listing Courses in a Shadcn-Vue Table
07:22 - Fixing Missing Relationships
08:23 - Testing the Courses Index Page
Join The Discussion! (5 Comments)
Please sign in or sign up for free to join in on the dicussion.
aaron-ford
It looks like shadcn updated recently to use Reka instead of Radix. I tried following the upgrade instructions at https://www.shadcn-vue.com/docs/changelog#update-your-project, by adding
to the components.json file, and then trying to reinstall the components, but I still get the same message as before:
An invalid components.json file was found at /plotmycourse.
Before you can add components, you must create a valid components.json file by running the init command.
Learn more at https://shadcn-vue.com/docs/components-json.
Should I just delete the components.json file and run the init? Or what is the best route forward for continuity with the course?
Please sign in or sign up for free to reply
aaron-ford
I found npx [email protected] add table, that seems to install it, though it does give a bunch of warnings:
npm WARN EBADENGINE Unsupported engine {
npm WARN EBADENGINE package: '[email protected]',
npm WARN EBADENGINE required: { node: '>=20.18.1' },
npm WARN EBADENGINE current: { node: 'v20.11.0', npm: '10.5.1' }
npm WARN EBADENGINE }
npm WARN deprecated [email protected]: This module is not supported, and leaks memory. Do not use it. Check out lru-cache if you want a good and tested way to coalesce async requests by a key value, which is much more comprehensive and powerful.
npm WARN deprecated [email protected]: See https://github.com/lydell/source-map-resolve#deprecated
npm WARN deprecated [email protected]: Glob versions prior to v9 are no longer supported
I'll try and continue with this, but if there's a better way, please let me know. Thanks!
Please sign in or sign up for free to reply
tomgobich
Yep! I'm working on updating lesson 1.4 of this series this weekend just for this, though in the updated lesson, I'll recommend sticking with Radix for the time being. Getting their Reka update working is too much of a change, and there may be several inner-component changes as well that would confuse those following this series. You can still access the documentation for the Radix version at radix.chadcn-vue.com. You can also target it via their CLI via:
I've tried getting their Reka updating working myself, and tried re-initializing - neither work without compromise. They dropped support for specifying a
tsconfig.json
location and will instead only check the project root for atsconfig.json
,tsconfig.web.json
, ortsconfig.app.json
file in that order. They have a preflight check on their CLI commands that will fail the command if the foundtsconfig
is missing an alias definition, which is also why it states thecomponents.json
file is incorrect despite it matching their spec.So the only possible way to get their Reka UI update working would be to rename the AdonisJS
tsconfig.json
file in the root of the project to something else, as Shadcn-Vue's preflight command check will only ever find and use this tsconfig file due to its name and priority in their search.You'd then need to move your Inertia
tsconfig.json
file out into the project root.I haven't tried, but you may have luck getting things working if you move all the Shadcn-Vue stuff into the
inertia
folder.Please sign in or sign up for free to reply
aaron-ford
Thanks. Just a note, I tried npx shadcn-vue@radix add table and it failed with an error 'Failed to fetch base color from registry.' I had to run it with a version (npx [email protected] add table) to get it to install, despite the many warnings.
Please sign in or sign up for free to reply
tomgobich
Looks like
npx shadcn-vue@radix
is targeting 0.11.4, just as an alias, so those should behave the same. It's possible there was a network issue - their add commands send API requests out to the actual ShadCN site to get configurations, like colors. Based on this issue, you might also have an invalidbaseColor
in yourcomponents.json
.Here's my attempt to run it and you can see it prompted me to install v0.11.4
The unsupported engine warning you got is stating that the package
undici
requires NodeJS v20.18.1 or higher, but you have v20.11.0 installed. So, that'll go away if you update your NodeJS version, not entirely sure what makes use ofundici
.Please sign in or sign up for free to reply