feat(vite-plugin-nitro): add internal deployment support for Netlify #1202

pieh · 2024-07-03T12:10:23Z

PR Checklist

Please check if your PR fulfills the following requirements:

The commit message follows our guidelines: https://github.com/analogjs/analog/blob/main/CONTRIBUTING.md#-commit-message-guidelines
Tests for the changes have been added (for bug fixes / features)
Docs have been added / updated (for bug fixes / features)

PR Type

What kind of change does this PR introduce?

Which package are you modifying?

What is the current behavior?

Users deploying to Netlify need to additionally configure location of produced serverless functions

Closes #

What is the new behavior?

Serverless functions are generated at location that Netlify platform automatically handle removing the need to specify ~custom serverless function directory when configuring deployments to Netlify.

Additional note is that hopefully soon at least non-nx variant would require zero configuration. We recently added Analog to frameworks we automatically detect ( netlify/build#5751 ) which soon will suggest appropiate settings when creating Analog site in Netlify web ui and there is work in-progress to use same detection automatically configure deployment when using Netlify CLI ( netlify/cli#6729 )

Does this PR introduce a breaking change?

Yes
No

Explanation: users defining Netlify Functions directory with current instructions will still be able to deploy successfully because Netlify always look for functions in adjusted directory, so even if we point functions directory to one that no longer exist (or at least doesn't have Analog function) it will work correctly:

Packaging Functions from .netlify/functions-internal directory:
 - server/server.mjs
No Functions were found in dist/analog directory

Other information

[optional] What gif best describes this PR or how it makes you feel?

netlify · 2024-07-03T12:10:38Z

✅ Deploy Preview for analog-blog ready!

Name	Link
🔨 Latest commit	`2dade9b`
🔍 Latest deploy log	https://app.netlify.com/sites/analog-blog/deploys/66853fb1fd20ea0008014cde
😎 Deploy Preview	https://deploy-preview-1202--analog-blog.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.

netlify · 2024-07-03T12:10:39Z

✅ Deploy Preview for analog-app ready!

Name	Link
🔨 Latest commit	`2dade9b`
🔍 Latest deploy log	https://app.netlify.com/sites/analog-app/deploys/66853fb17e9c7900089846a6
😎 Deploy Preview	https://deploy-preview-1202--analog-app.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.

netlify · 2024-07-03T12:10:42Z

✅ Deploy Preview for analog-docs ready!

Name	Link
🔨 Latest commit	`2dade9b`
🔍 Latest deploy log	https://app.netlify.com/sites/analog-docs/deploys/66853fb1cc820a0008834fe3
😎 Deploy Preview	https://deploy-preview-1202--analog-docs.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.

netlify · 2024-07-03T12:12:53Z

✅ Deploy Preview for analog-ng-app ready!

Name	Link
🔨 Latest commit	`2dade9b`
🔍 Latest deploy log	https://app.netlify.com/sites/analog-ng-app/deploys/66853fb1e4651b00086362af
😎 Deploy Preview	https://deploy-preview-1202--analog-ng-app.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.

brandonroberts · 2024-07-03T13:18:18Z

Thanks @pieh! Can this be zero-config for static assets also?

pieh · 2024-07-03T14:04:53Z

Can this be zero-config for static assets also?

With netlify/build#5751 we will soon automatically pre-fill configuration when creating a new site on Netlify web app (once that change actually end up in production), so this flow will be ~somewhat zero conf for static assets soon.

For CLI usage (netlify deploy --build) for now users will still need to define deploy settings in netlify.toml configuration file, but this no longer will be needed when netlify/cli#6729 is finished, so eventually it will be fully zero conf, just not yet.

Netlify doesn't have equivalent to something like Vercel's output api for static assets (https://github.com/analogjs/analog/blob/beta/packages/vite-plugin-nitro/src/lib/vite-plugin-nitro.ts#L354-L356) where there is always specific directory from which static assets are uploaded - Netlify relies on "publish directory" for those things, so instead of frameworks putting those files in deployment specific directory, either user or our framework detection tell us where framework outputs static assets

With that said, I think something is not exactly right with either this change or configuration of test Netlify sites/apps because preview deploy for analog-app 404s for API route ( https://deploy-preview-1202--analog-app.netlify.app/api/v1/products ) which wasn't happening for previous pull requests ( https://deploy-preview-1201--analog-app.netlify.app/api/v1/products ), so this probably should not be merged yet until this is figured out what's wrong.

I did attempt to deploy this app on my side of things locally with following configuration (so functions dir is not set, relying on the change I did):

# netlify.toml
[build]
command = "nx build analog-app"
publish = "dist/apps/analog-app/analog/public"

and I did get working deploy ( https://66855a09ed43201e349b11f4--analog-app-no-functions-defined-test.netlify.app/api/v1/products ), so some debugging is needed why deploy preview on this PR is not actually working correctly

brandonroberts · 2024-07-03T14:33:17Z

Thanks for getting better Analog support merged into Netlify!

Ok cool. It could be my manual deployment settings that are conflicting.

pieh · 2024-07-04T09:54:45Z

I think I have clue given the site settings - the "Package path" is not set here while mine was equivalent to apps/analog-app and likely the function was generated in apps/analog-app/.netlify/functions-internal, while Netlify would look for /.netlify/functions-internal when "Package path" is not set.

So while I do think it would be beneficial for site to specify "correct" package path, any change in this PR should NOT break the sites with currently working setting, so I'll look if I can figure out setup that would just work for both scenarios with Package Path set and not set.

I don't have much Nitro knowledge and the dir I set here is just straight copied from Nitro's Netlify preset ( https://github.com/unjs/nitro/blob/63526f24b03e5e5de65934c697c92dd00f1e1ab1/src/presets/netlify/preset.ts#L20 ), so this change likely "inherited" the same problem from the original setting

brandonroberts · 2024-07-05T13:15:43Z

packages/vite-plugin-nitro/src/lib/vite-plugin-nitro.ts

+  ...nitroConfig,
+  output: {
+    ...nitroConfig?.output,
+    dir: '{{ rootDir }}/.netlify/functions-internal',


I think what we need to do here is set the serverDir. The dir sets the output for everything else, including the publicDir and .nitro build directory.

Suggested change

dir: '{{ rootDir }}/.netlify/functions-internal',

serverDir: '{{ rootDir }}/.netlify/functions-internal',

brandonroberts · 2024-07-05T13:17:45Z

Yea, I don't usually use the package path because even in a monorepo setup like Nx, I build from the root and use the project path to build where the output goes in the dist folder, which I think is more common.

brandonroberts · 2024-08-29T15:13:36Z

@pieh were you able to find anything else on this?

pieh added 2 commits July 3, 2024 13:39

feat(vite-plugin-nitro): add internal deployment support for Netlify

ade5fdd

docs: update Netlify deployment setup instructions

2dade9b

vercel bot deployed to Preview July 3, 2024 12:12 View deployment

brandonroberts requested changes Jul 5, 2024

View reviewed changes

brandonroberts closed this Oct 3, 2024

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

feat(vite-plugin-nitro): add internal deployment support for Netlify #1202

feat(vite-plugin-nitro): add internal deployment support for Netlify #1202

pieh commented Jul 3, 2024

netlify bot commented Jul 3, 2024 •

edited

Loading

netlify bot commented Jul 3, 2024 •

edited

Loading

netlify bot commented Jul 3, 2024 •

edited

Loading

netlify bot commented Jul 3, 2024 •

edited

Loading

brandonroberts commented Jul 3, 2024

pieh commented Jul 3, 2024

brandonroberts commented Jul 3, 2024

pieh commented Jul 4, 2024

brandonroberts Jul 5, 2024

brandonroberts commented Jul 5, 2024

brandonroberts commented Aug 29, 2024

	dir: '{{ rootDir }}/.netlify/functions-internal',
	serverDir: '{{ rootDir }}/.netlify/functions-internal',

feat(vite-plugin-nitro): add internal deployment support for Netlify #1202

feat(vite-plugin-nitro): add internal deployment support for Netlify #1202

Conversation

pieh commented Jul 3, 2024

PR Checklist

PR Type

Which package are you modifying?

What is the current behavior?

What is the new behavior?

Does this PR introduce a breaking change?

Other information

[optional] What gif best describes this PR or how it makes you feel?

netlify bot commented Jul 3, 2024 • edited Loading

✅ Deploy Preview for analog-blog ready!

netlify bot commented Jul 3, 2024 • edited Loading

✅ Deploy Preview for analog-app ready!

netlify bot commented Jul 3, 2024 • edited Loading

✅ Deploy Preview for analog-docs ready!

netlify bot commented Jul 3, 2024 • edited Loading

✅ Deploy Preview for analog-ng-app ready!

brandonroberts commented Jul 3, 2024

pieh commented Jul 3, 2024

brandonroberts commented Jul 3, 2024

pieh commented Jul 4, 2024

brandonroberts Jul 5, 2024

Choose a reason for hiding this comment

brandonroberts commented Jul 5, 2024

brandonroberts commented Aug 29, 2024

netlify bot commented Jul 3, 2024 •

edited

Loading

netlify bot commented Jul 3, 2024 •

edited

Loading

netlify bot commented Jul 3, 2024 •

edited

Loading

netlify bot commented Jul 3, 2024 •

edited

Loading