fix: switch to experimental image support and import missing images

astro.config.mjs

@@ -1,9 +1,11 @@
-import { defineConfig } from 'astro/config';
-import tailwind from '@astrojs/tailwind';
-import react from '@astrojs/react';
-import image from '@astrojs/image';
+import { defineConfig } from 'astro/config'
+import tailwind from '@astrojs/tailwind'
+import react from '@astrojs/react'
 
 // https://astro.build/config
 export default defineConfig({
-  integrations: [tailwind({ config: { applyBaseStyles: false } }), image(), react()],
-});
+    integrations: [tailwind({ config: { applyBaseStyles: false } }), react()],
+    experimental: {
+        assets: true
+    }
+})

package.json

@@ -16,7 +16,6 @@
         "semantic-release": "semantic-release"
     },
     "dependencies": {
-        "@astrojs/image": "^0.16.6",
         "@astrojs/react": "^2.1.1",
         "@astrojs/tailwind": "^3.1.1",
         "@types/react": "^18.2.0",

src/components/Home/Web3/Web3.astro

@@ -1,9 +1,12 @@
+---
+import gfxLeft from "../../../assets/home-gfx-left.png"
+---
 <section
   id="web3"
   class="flex flex-col lg:flex-row lg:bg-transparent lg:p-0 gap-10 mx-10 sm:mx-20 xl:mx-40"
 >
   <div class="flex-1 -ml-10 -mr-20 lg:-ml-40 lg:mr-0">
-    <img src="/src/assets/home-gfx-left.png" class="w-full" />
+    <img src={gfxLeft.src} class="w-full" />
   </div>
   <div class="flex-1 -mt-40 space-y-10 flex flex-col justify-center">
     <h2

src/components/Layout/Navbar/Navbar.astro

@@ -1,4 +1,5 @@
 ---
+import logo from "../../../assets/lume-logo.png";
 const { view } = Astro.props;
 
 function getActiveClass(linkView) {
@@ -10,7 +11,7 @@ function getActiveClass(linkView) {
   <div class="logo">
     <!-- TODO: Hide this logo and show simplified when 320 > width -->
     <a href="/">
-      <img class="w-44" src="/src/assets/lume-logo.png" alt="Lume Logo" />
+      <img class="w-44" src={logo.src} alt="Lume Logo" />
     </a>
   </div>
   <menu