Refactor imports in Astro project

astro/src/components/Content.astro

@@ -1,7 +1,7 @@
 ---
 import { Image } from "@astrojs/image/components";
-import { getContentArray } from "../utils/helpers";
-import { getImageSrc } from "../utils/payload";
+import { getContentArray } from "src/utils/helpers";
+import { getImageSrc } from "src/utils/payload";
 const { content } = Astro.props;
 const contentArray = getContentArray(content);
 ---

astro/src/layouts/Layout.astro

@@ -1,5 +1,5 @@
 ---
-import "../global.css";
+import "global.css";
 export interface Props {
   title: string;
 }

astro/src/pages/index.astro

@@ -1,6 +1,6 @@
 ---
-import Layout from "../layouts/Layout.astro";
-import { getPosts } from "../utils/payload";
+import Layout from "src/layouts/Layout.astro";
+import { getPosts } from "src/utils/payload";
 
 const posts = await getPosts();
 ---

astro/src/pages/posts/[id].astro

@@ -1,8 +1,8 @@
 ---
-import Layout from "../../layouts/Layout.astro";
-import Content from "../../components/Content.astro";
-import type { Post } from "../../types";
-import { getPost, getPosts } from "../../utils/payload";
+import Layout from "src/layouts/Layout.astro";
+import Content from "src/components/Content.astro";
+import type { Post } from "src/types";
+import { getPost, getPosts } from "src/utils/payload";
 
 export async function getStaticPaths() {
   const posts = await getPosts();

astro/src/utils/payload.ts

@@ -1,4 +1,4 @@
-import type { Post } from "../types";
+import type { Post } from "src/types";
 
 const url = import.meta.env.DEV
   ? "http://payload:3001"

astro/tsconfig.json

@@ -1,6 +1,7 @@
 {
   "extends": "astro/tsconfigs/strict",
   "compilerOptions": {
-    "types": ["@astrojs/image/client"]
+    "types": ["@astrojs/image/client"],
+    "baseUrl": "."
   }
 }