Nuxt 3.5.1 get error on build " ERROR Cannot read properties of undefined (reading 'sys') (x4) "

I have an application made using Nuxt 3.5.1 this is the script tag :

<script lang="ts" setup>
     import { IProduct } from './types';
     const p = defineProps<IProduct>();
</script>

types.ts :

export type IProduct =  {
   name?: string;
   id?: number;
   price?: number;
   thumbnail?: string;

   title: string;

}

export interface IProductSecond {
   n: string;
   id: number;
}

but when I run

>npm run  dev 

I get this error :

If I replace :

const p = defineProps<IProduct>();

with

const p = defineProps<{ name?: string;
   id?: number;
   price?: number;
   thumbnail?: string;
   title: string;}>();

It works fine

It's not long since Vue 3.3 is dropped and as of now, Nuxt doesn't have built-in support for Vue 3.3's "Imported Types". There's a workaround for this though:

• If you don't have typescript in package.json, add it npm i -D typescript (required)
• Add following code in your nuxt.config.ts:

import { existsSync, readFileSync } from "node:fs";

export default defineNuxtConfig({
  vite: {
    vue: {
      script: {
        fs: {
          fileExists(file: string) {
            return existsSync(file);
          },
          readFile(file: string) {
            return readFileSync(file, "utf-8");
          },
        },
      },
    },
  },
});

References:

• Announcing Vue 3.3
• Imported types (vue 3.3 feature) not working (Once this issue gets closed, you should remove the workaround)