My ts compiler is not working in next.js v14 project

Question

I have a project of next.js 14 and typescript v5 installed.

I noticed that ts compiler is not showing errors for types and generally is not working as expected.

Here is an example code component, ideally i have to make an interface or a type for the two props (country and area) in the other hand is not complaining at all.

const PropertyInformation = ({country, area}) => {
  return (
    <Flex justify={"unset"} direction={"row"} columnGap={48} p={16}>
      <Flex align={"center"} direction={"row"} columnGap={16}>
        <Image src={building} alt="Logo" width={48} height={48} />{" "}
        <Text size={"xl"}>a Flat</Text>
      </Flex>
      <Flex align={"center"} direction={"row"} columnGap={16}>
        <Image src={dimensions} alt="Logo" width={48} height={48} />{" "}
        <Text size={"xl"}>{area} m2</Text>
      </Flex>
      <Flex align={"center"} direction={"row"} columnGap={16}>
        <Image src={location} alt="Logo" width={48} height={48} />{" "}
        <Text size={"xl"}>{country}</Text>{" "}
      </Flex>
    </Flex>
  );
};
export default PropertyInformation;

Also i post the tsconfig file

{
  "compilerOptions": {
    "lib": ["dom", "dom.iterable", "esnext"],
    "allowJs": true,
    "skipLibCheck": true,
    "strict": true,
    "noEmit": true,
    "esModuleInterop": true,
    "module": "esnext",
    "moduleResolution": "bundler",
    "resolveJsonModule": true,
    "isolatedModules": true,
    "jsx": "preserve",
    "incremental": true,
    "plugins": [
      {
        "name": "next"
      }
    ],
    "paths": {
      "@/*": ["./*"]
    }
  },
  "include": ["app/", "next-env.d.ts", "**/*.ts", "**/*.tsx", ".next/types/**/*.ts", "./theme/declarations.d.ts"],
  "exclude": ["node_modules"]
}

Finally two images from my root directory and Configure Typescript (from webstorm)

Answer 1

The issue has been solved. I had an old version of webstrom IDE and with the newer version of typescript and next.js 14 is not working as expected.