Missing "./components/StoryblokComponent.astro" specifier in "@storyblok/astro" package

Question

I am building an Astro app accompanied by StoryBlok. I follow this tutorial- (https://www.storyblok.com/tp/add-a-headless-cms-to-astro-in-5-minutes)

I've created a storyblok folder and multiple Astro files named 'Teaser', 'Page', 'Grid', and 'Feature'. In 'Page.astro' and 'Grid.astro', there is this import- import StoryblokComponent from '@storyblok/astro/components/StoryblokComponent.astro' But seems like astro is not able to import these components...

The error is as follows-

I went to node_modules to have a look at the @storyblok folder and specifically to the 'StoryblokComponent.astro'. Then I saw that there are errors in the imports inside that file also...

I can't seem to find/understand what I am supposed to do... I followed every step of the tutorials, and the internet doesn't seem to have a lot of helpful troubleshooting information about this problem. It seems a little weird that the installation should be that hard and at this level of depth.

Here is my StoryblokComponent.astro code placed in node_modules -> @storyblok -> astro -> components

---
import components from "virtual:storyblok-components";
import options from "virtual:storyblok-options";
import camelcase from "camelcase";
import type { SbBlokData } from "./dist/types";
import type { AstroComponentFactory } from "astro/dist/runtime/server";

interface Props {
  blok: SbBlokData;
  [prop: string]: unknown;
}

const { blok, ...props } = Astro.props;

if (!blok) {
  throw new Error(
    "Cannot render StoryblokComponent. 'blok' prop is undefined."
  );
}

/**
 * convert blok components to camel case to match vite-plugin-storyblok-components
 */
let key = camelcase(blok.component);

const componentFound: boolean = key in components;

let Component: AstroComponentFactory;

if (!componentFound) {
  if (!options.enableFallbackComponent)
    throw new Error(
      `Component could not be found for blok "${blok.component}"! Is it defined in astro.config.mjs?`
    );
  else {
    Component = components["FallbackComponent"];
  }
} else {
  Component = components[key];
}
---

<Component blok={blok} {...props} />