Module not found: Can't resolve Next.js - TypeScript

Viewed 891

I receive the image´s error but I don´t understand why do I get it. Also attached the directory in the second image.

enter image description here

import Link from 'next/link';
import { useState } from 'react';
import { ProductModel } from '../models/product';
import { CardProduct } from '../components/CardProduct';

const List = () => {

  let list: ProductModel[] = [  //ProductModel[] esto significa que va a ser un array de ProductModel
    {
      id: 1,
      name: "shoes",
      price: 9999,
    },
  ];

  const [products, setProducts] = useState<ProductModel[]>(list);

  return (
    <div>
      Soy la página de Productos
      {products.map((element, index) => {
        return <CardProduct product={element}/>;
      })}
      <br/>
      <Link href="/">
        <a>Ir a la home</a>
      </Link>
    </div>
  );
}

export default List;

enter image description here

1 Answers

You need to create an empty tsconfig.json file in your root folder and then run npm as you would normally (for instance, npm run dev). NextJs will then populate the file with default ts config values. See here:

https://nextjs.org/docs/basic-features/typescript

Related