Image to be optiized with Vercel (#503)

* images

* images2

* packages

* landing page hero

* fix sizes

* image to picture

* cool stuff

* cto hero

* async load calcom

* fix background image

* meeting croc fix

* services

* values fix

* testimonials

Author: davidabram

apps/website/astro.config.mjs

@@ -1,8 +1,9 @@
 import { defineConfig } from 'astro/config';
 import tailwind from '@astrojs/tailwind';
 import react from '@astrojs/react';
-import vercel from '@astrojs/vercel/static';
+import vercel from '@astrojs/vercel/serverless'
 import createRemarkPlugin from '@crocoder-dev/remark-plugin';
+import image from '@astrojs/image';
 
 const classes = {
   titleClass: 'font-bold text-[1.25rem] mt-[2.5rem]',
@@ -15,19 +16,14 @@ const remarkPlugin = createRemarkPlugin(classes);
 
 export default defineConfig({
   prefetch: true,
-  output: 'static',
+  output: 'server',
   adapter: vercel({
-    imageService: true,
-    imagesConfig: {
-      sizes: [640, 936],
-      domains: ['*'],
-    },
   }),
   redirects: {
     '/feed': '/rss.xml',
     '/sitemap': '/sitemap.xml'
   },
-  integrations: [tailwind(), react()],
+  integrations: [tailwind(), react(), image()],
   markdown: {
     remarkPlugins: [remarkPlugin],
   },

apps/website/package.json

@@ -3,21 +3,22 @@
   "module": "index.ts",
   "type": "module",
   "dependencies": {
+    "@astrojs/image": "^0.18.0",
     "@astrojs/react": "^4.1.2",
     "@astrojs/rss": "^4.0.11",
     "@astrojs/tailwind": "^6.0.2",
-    "@astrojs/vercel": "^8.0.1",
+    "@astrojs/vercel": "^8.1.5",
+    "@crocoder-dev/remark-plugin": "*",
     "@crocoder-dev/tailwind": "*",
     "astro": "5.7.13",
     "astro-font": "^1.1.0",
     "classnames": "^2.5.1",
-    "react-icons": "^5.4.0",
-    "@crocoder-dev/remark-plugin": "*",
     "date-fns": "^4.1.0",
     "marked": "^15.0.5",
+    "posthog-js": "^1.222.0",
     "react": "^19.0.0",
     "react-dom": "^19.0.0",
-    "posthog-js": "^1.222.0"
+    "react-icons": "^5.4.0"
   },
   "scripts": {
     "dev": "astro dev --port 4321",