Preview Command

[archiewood]

Description

• This adds a npm run preview command to evidence which allows you to view the built version of a site locally
• This should not be used as a production server, see vite docs

This closes #259

Note: this will require an update to the template package.json to expose to users

Checklist

• I have added a changeset

[changeset-bot]

🦋 Changeset detected

Latest commit: 13d9c1e

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 2 packages

Name	Type
@evidence-dev/evidence	Patch
evidence-test-environment	Patch

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

[vercel]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Comments	Updated (UTC)
docs	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Jan 31, 2024 3:46pm

[netlify]

✅ Deploy Preview for evidence-development-workspace ready!

Name	Link
🔨 Latest commit	13d9c1e
🔍 Latest deploy log	https://app.netlify.com/sites/evidence-development-workspace/deploys/65ba6b398e16c70008e57cfe
😎 Deploy Preview	https://deploy-preview-1542--evidence-development-workspace.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify site configuration.

[csjh]

I don't think vite preview would actually serve the static output directory here, I think it would actually run the app as though it was an adapter-node. I usually use npx serve build to preview built projects but that has the annoyance of adding a dependency

[archiewood]

I usually use npx serve build to preview built projects but that has the annoyance of adding a dependency

@csjh yeah I wanted to use vite so that we didn't have to do that - I normally use http-server but same issue

I don't think vite preview would actually serve the static output directory here

what makes you think that is the case? this appeared to work for me locally on test-env

[csjh]

I think it should still work, but it would be more akin to dev mode than a preview of a built project. They might've changed it since, but a quick test would be to delete the build directory and see if it still works - if it does, then it's previewing as a non-static project.

[archiewood]

I did an alternative test which was to change the dev project, and re-run preview

The served site did not include the changes

The Vite Docs suggest

vite preview
Locally preview the production build. Do not use this as a production server as it's not designed for it.

[csjh]

Yeah that would stay the same because in reality there's a second build folder called .svelte-kit which contains the "raw" build output which adapter-static then adapts into static build output into the build folder

[archiewood]

Perhaps I should handle this error a bit better though, its not exactly a nice error

error when starting preview server:
Error: The directory "build" does not exist. Did you build your project?
    at preview (file:///Users/archie/Projects/evidence/node_modules/.pnpm/vite@4.3.9/node_modules/vite/dist/node/chunks/dep-e8f070e8.js:63861:15)
    at async CAC.<anonymous> (file:///Users/archie/Projects/evidence/node_modules/.pnpm/vite@4.3.9/node_modules/vite/dist/node/cli.js:865:24)

[hughess]

There was a page I had to comment out in test-env to get my local build to work, but the preview command worked well!