Unable to run storefront in production because of build errors about medusa HOT 6 OPEN

@sradevski I am also facing this issue with a completely clean (out of the box) install.

I have created a clean install that replicates the issue here: matmar10/medusa-storefront

Steps to reproduce:

This is using Node v20.12.2

1. npx create-next-app -e https://github.com/medusajs/nextjs-starter-medusa my-medusa-storefront
2. cd my-medusa-storefront
3. npm run build

Expected behavior:

1. Project builds okay out of the box -or-
2. Removing the @ts-expect-error allows to build

Actual behavior

./src/modules/products/components/product-tabs/accordion.tsx:57:8
Type error: Unused '@ts-expect-error' directive.

  55 |       )}
  56 |     >
> 57 |       {/* @ts-expect-error */}
     |        ^
  58 |       <AccordionPrimitive.Header className="px-1">
  59 |         <div className="flex flex-col">
  60 |           <div className="flex w-full items-center justify-between">

Work-Around / Fix

You can resolve the issue by leaving the first @ts-expect-error and removing the remaining ones:

diff --git a/src/modules/products/components/product-tabs/accordion.tsx b/src/modules/products/components/product-tabs/accordion.tsx
index db8855a..03d837a 100644
--- a/src/modules/products/components/product-tabs/accordion.tsx
+++ b/src/modules/products/components/product-tabs/accordion.tsx
@@ -54,14 +54,12 @@ const Item: React.FC<AccordionItemProps> = ({
         className
       )}
     >
-      {/* @ts-expect-error */}
       <AccordionPrimitive.Header className="px-1">
         <div className="flex flex-col">
           <div className="flex w-full items-center justify-between">
             <div className="flex items-center gap-4">
               <Text className="text-ui-fg-subtle text-sm">{title}</Text>
             </div>
-            {/* @ts-expect-error */}
             <AccordionPrimitive.Trigger>
               {customTrigger || <MorphingTrigger />}
             </AccordionPrimitive.Trigger>
@@ -73,7 +71,6 @@ const Item: React.FC<AccordionItemProps> = ({
           )}
         </div>
       </AccordionPrimitive.Header>
-      {/* @ts-expect-error */}
       <AccordionPrimitive.Content
         forceMount={forceMountContent}
         className={clx(

from medusa.

I had this error as well with npm, I tried the fix above but got a different error - tried adding @medusajs/types but no luck.

I deleted my .node-modules and then used yarn, yarn dev, and yarn build - it ran successfully and built the next app

from medusa.

@AwaaX I can build the project without issues. Can you please provide more information to reproduce the issue from a clean clone? What command did you run? Are you running main? What is your node/yarn version?

What are you trying to run, the starter project?

from medusa.

same here with node 20

from medusa.

@AwaaX I can build the project without issues. Can you please provide more information to reproduce the issue from a clean clone? What command did you run? Are you running main? What is your node/yarn version?

What are you trying to run, the starter project?

I do npx create-next-app -e https://github.com/medusajs/nextjs-starter-medusa my-medusa-storefront
then npm run build

node -v
v20.15.1

npm -v
10.7.0

@sradevski I am also facing this issue with a completely clean (out of the box) install.

I have created a clean install that replicates the issue here: matmar10/medusa-storefront

Steps to reproduce:

This is using Node v20.12.2

1. `npx create-next-app -e https://github.com/medusajs/nextjs-starter-medusa my-medusa-storefront`

2. `cd my-medusa-storefront`

3. `npm run build`

Expected behavior:

1. Project builds okay out of the box -or-

2. Removing the `@ts-expect-error` allows to build

Actual behavior

./src/modules/products/components/product-tabs/accordion.tsx:57:8
Type error: Unused '@ts-expect-error' directive.

  55 |       )}
  56 |     >
> 57 |       {/* @ts-expect-error */}
     |        ^
  58 |       <AccordionPrimitive.Header className="px-1">
  59 |         <div className="flex flex-col">
  60 |           <div className="flex w-full items-center justify-between">

Work-Around / Fix

You can resolve the issue by leaving the first @ts-expect-error and removing the remaining ones:

diff --git a/src/modules/products/components/product-tabs/accordion.tsx b/src/modules/products/components/product-tabs/accordion.tsx
index db8855a..03d837a 100644
--- a/src/modules/products/components/product-tabs/accordion.tsx
+++ b/src/modules/products/components/product-tabs/accordion.tsx
@@ -54,14 +54,12 @@ const Item: React.FC<AccordionItemProps> = ({
         className
       )}
     >
-      {/* @ts-expect-error */}
       <AccordionPrimitive.Header className="px-1">
         <div className="flex flex-col">
           <div className="flex w-full items-center justify-between">
             <div className="flex items-center gap-4">
               <Text className="text-ui-fg-subtle text-sm">{title}</Text>
             </div>
-            {/* @ts-expect-error */}
             <AccordionPrimitive.Trigger>
               {customTrigger || <MorphingTrigger />}
             </AccordionPrimitive.Trigger>
@@ -73,7 +71,6 @@ const Item: React.FC<AccordionItemProps> = ({
           )}
         </div>
       </AccordionPrimitive.Header>
-      {/* @ts-expect-error */}
       <AccordionPrimitive.Content
         forceMount={forceMountContent}
         className={clx(

Thanks, you should edit : Keep the two firsts: one line 30 , one line 48 **

after it work

from medusa.

same here with node 18.20.4

from medusa.