netlify-templates / astro-platform-starter

A modern starter based on Astro.js, Tailwind, daisyUI, and Netlify Core Primitives (Edge Functions, Image CDN, Blob Store).
https://astro-platform-starter.netlify.app/
20 stars 15 forks source link

[preview] The @astrojs/netlify adapter does not support the preview command. #63

Closed nicksmithr closed 2 months ago

nicksmithr commented 2 months ago

Hey Netlifolk, Thanks for the template, it's really awesome! I'm having a few issues now I'm actually building a full site with it. I've tried deploying the site and it's 404ing.

Update: So I tried previewing, and saw this issue. I've now got the site deployed, but would be helpful to have the preview function!

——— OLD CONTEXT

It seems to be building fine, and fine in dev, but the deployment is resulting in page not found. And there's no way to preview if it's the build process that's broken or my netlify configuration.

My ./dist shape.

It may be because I updated the astro.config.mjs to resolve a vite issue, where I was getting:

09:04:56 [WARN] [vite] The file does not exist at "/Users/me/site/node_modules/.vite/deps/chunk-5E3PJM5T.js?v=e914b06b" which is in the optimize deps directory. The dependency might be incompatible with the dep optimizer. Try adding it to `optimizeDeps.exclude`.

Here's the update Astro config:

...rest of Astro config
 vite: {
        optimizeDeps: {
            include: ['@sanity/asset-utils']
        }
    },

CleanShot 2024-07-19 at 09 31 30@2x

My full Astro Config:

import { defineConfig } from 'astro/config';
import netlify from '@astrojs/netlify';
import react from '@astrojs/react';
import tailwind from '@astrojs/tailwind';
import sanity from '@sanity/astro';

// https://astro.build/config
export default defineConfig({
    integrations: [
        react(),
        tailwind({
            applyBaseStyles: false
        }),
        sanity({
            projectId: 'xrq4swux',
            dataset: 'production',
            // Set useCdn to false if you're building statically.
            useCdn: false,
            studioBasePath: '/studio'
        })
    ],
    vite: {
        optimizeDeps: {
            include: ['@sanity/asset-utils']
        }
    },
    output: 'hybrid',
    adapter: netlify()
});

My packages.json:

{
  "name": "astro-netlify-platform-starter",
  "type": "module",
  "version": "0.1.0",
  "scripts": {
    "dev": "astro dev",
    "start": "astro dev",
    "build": "astro build",
    "preview": "astro preview",
    "astro": "astro"
  },
  "dependencies": {
    "@astrojs/netlify": "^5.4.0",
    "@astrojs/react": "^3.6.0",
    "@astrojs/tailwind": "^5.1.0",
    "@fontsource-variable/plus-jakarta-sans": "^5.0.21",
    "@fontsource/inter": "^5.0.18",
    "@netlify/blobs": "^7.3.0",
    "@netlify/functions": "^2.7.0",
    "@sanity/astro": "^3.1.3",
    "@sanity/client": "^6.20.0",
    "@sanity/image-url": "^1.0.2",
    "@sanity/visual-editing": "^2.1.4",
    "@types/react": "^18.3.3",
    "@types/react-dom": "^18.3.0",
    "astro": "^4.11.6",
    "astro-portabletext": "^0.10.0",
    "blobshape": "^1.0.0",
    "marked": "^12.0.1",
    "marked-shiki": "^1.1.0",
    "prettier-plugin-astro": "^0.14.1",
    "react": "^18.3.1",
    "react-dom": "^18.3.1",
    "react-player": "^2.16.0",
    "sanity": "^3.45.0",
    "sharp": "^0.33.4",
    "styled-components": "^6.1.12",
    "tailwindcss": "^3.4.3",
    "unique-names-generator": "^4.7.1"
  },
  "devDependencies": {
    "@types/blobshape": "^1.0.3",
    "@types/node": "^20.12.7",
    "daisyui": "^4.10.2"
  }
}

Appreciate your help 💙

serhalp commented 2 months ago

Hi @nicksmithr!

When using SSR, astro preview currently only works with the node adapter: https://docs.astro.build/en/reference/cli-reference/#astro-preview.

However, you can use the Netlify CLI to preview production builds locally: https://cli.netlify.com/commands/serve/.

Hope that helps.

P.S. We're hoping to make this more seamless in the future!