Skip to content

Commit f6776f5

Browse files
authored
feat: support @19 (#216)
* chore: add angular@19 test fixture without prerendering and ssr * chore: add angular@19 test fixture with prerendering and ssr using stable CommonEngine * chore: add angular@19 test fixture with prerendering and ssr using Developer Preview App Engine * chore: add scripts for installing new fixture dependencies * test: add test for version validation when angular@19 is used * test: add test for version validation when angular deps are missing * chore: add entire .netlify dirs to .gitignore * test: add initial (failing) build tests for Angular 19 fixtures * refactor: split reading angular version out to separate helper function * fix: handle prerendered-routes.json shape in Angular 19 * chore: add runtime to new fixture dependencies * chore: upgrade demo to Angular 19 * fix: hopefully initial working demo deployment using CommonEngine * test: check if process import is result of using default server.ts * test: fix used fixture dir in one of tests * fix: only patch deno method in Deno env * fix: try/catch deno.readFile patching to avoid potential fatal errors * chore: upgrade @netlify/build * test: update assertion for changed hashes after update * Revert "test: check if process import is result of using default server.ts" This reverts commit 8a7a7cb. * fix: add engine name to 'not supported' error message * refactor: simplify user code * test: remove dashboard from expected excluded paths as it's now server rendered * test: adjust test setup to not be impacted by angular-runtime devDeps * chore: adjust eslint directive after adding @angular/ssr dev dep * chore: upgrade node types (for before/after from node:test) * fix: workaround type problem for now * fix: automatically set Netlify compatible request handler using CommonEngine * fix: support AppEngine * test: update new test fixtures to rc.1 * fix: apply headers for prerendered routes * fix: swap original server.ts back after build or failure * fix: remove @android/ssr from dev and peerDeps * chore(demo): migrate default server.ts to angular@19 * fix: update disabled rule after removing @angular/ssr devDep * fix: lint * chore: sync lock files * docs: update readme for angular@19 * docs: update readme toc * fix: re-add @ts-expect-error for app engine until angular types are adjusted * chore: remove outdated TODOs * chore: update jsdocs * chore: upgrade to most recent RCs * test: update assertion after package bump * feat: initial boilerplate and tooling to start matching server.ts to known variants * feat: only autoswap for known module content, otherwise fail build with actionable error * fix: now that we require default or netlify compatible server.ts - update demo site * chore: drop unuseful comment * fix: attempt to normalize content for signature so crlf endlines are treated as lf
1 parent 24e330e commit f6776f5

File tree

113 files changed

+107046
-7679
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

113 files changed

+107046
-7679
lines changed

.gitignore

+2-4
Original file line numberDiff line numberDiff line change
@@ -141,7 +141,5 @@ Temporary Items
141141

142142
# End of https://www.toptal.com/developers/gitignore/api/osx,node
143143

144-
.netlify/functions
145-
.netlify/functions-serve
146-
.netlify/functions-internal
147-
.angular
144+
.netlify
145+
.angular

.prettierignore

+2-1
Original file line numberDiff line numberDiff line change
@@ -17,4 +17,5 @@ node_modules
1717

1818
# Tests
1919
test
20-
tests/fixtures
20+
tests/fixtures
21+
tools/known-server-ts-signatures

README.md

+65-2
Original file line numberDiff line numberDiff line change
@@ -17,6 +17,8 @@ This build plugin implements Angular Support on Netlify.
1717

1818
- [Installation and Configuration](#installation-and-configuration)
1919
- [Accessing `Request` and `Context` during Server-Side Rendering](#accessing-request-and-context-during-server-side-rendering)
20+
- [Customizing request handling](#customizing-request-handling)
21+
- [Limitations](#limitations)
2022
- [CLI Usage](#cli-usage)
2123
- [Getting Help](#getting-help)
2224
- [Contributing](#contributing)
@@ -76,10 +78,71 @@ To test this in local development, run your Angular project using `netlify serve
7678
```sh
7779
netlify serve
7880
```
81+
### App Engine Developer Preview usage with Angular@19
7982

80-
## Limitations
83+
If you opt into the App Engine Developer Preview accessing `Request` and `Context` objects is streamlined. Instead of custom Netlify prefixed providers, you should use the standardized injection tokens for those provided by `@angular/ssr` instead:
8184

82-
- The [`server.ts` file](https://angular.dev/guide/ssr#configure-server-side-rendering) that's part of the Angular scaffolding is meant for deploying to a VM, and is not compatible with this Netlify build plugin. If you applied changes to that file, you'll need to replicate them in an Edge Function. See (#135)[https://github.com/netlify/angular-runtime/issues/135] for an example.
85+
```diff
86+
+import { REQUEST, REQUEST_CONTEXT } from '@angular/ssr/tokens'
87+
import type { Context } from "@netlify/edge-functions"
88+
89+
export class FooComponent {
90+
91+
constructor(
92+
// ...
93+
- @Inject('netlify.request') @Optional() request?: Request,
94+
- @Inject('netlify.context') @Optional() context?: Context,
95+
+ @Inject(REQUEST) @Optional() request?: Request,
96+
+ @Inject(REQUEST_CONTEXT) @Optional() context?: Context,
97+
) {
98+
console.log(`Rendering Foo for path ${request?.url} from location ${context?.geo?.city}`)
99+
// ...
100+
}
101+
102+
}
103+
```
104+
105+
## Customizing request handling
106+
107+
Starting with Angular@19. The build plugin makes use of `server.ts` file to handle requests. The default Angular scaffolding does generate incompatible code for Netlify so build plugin will swap it for compatible `server.ts` file for you automatically if it detects default one being used. If you need to customize the request handling, you can do so by copying one of code snippets below to your `server.ts` file.
108+
109+
If you did not opt into the App Engine Developer Preview:
110+
111+
```ts
112+
import { CommonEngine } from '@angular/ssr/node'
113+
import { render } from '@netlify/angular-runtime/common-engine'
114+
115+
const commonEngine = new CommonEngine()
116+
117+
export async function netlifyCommonEngineHandler(request: Request, context: any): Promise<Response> {
118+
return await render(commonEngine)
119+
}
120+
```
121+
122+
If you opted into the App Engine Developer Preview:
123+
124+
```ts
125+
import { AngularAppEngine, createRequestHandler } from '@angular/ssr'
126+
import { getContext } from '@netlify/angular-runtime/context'
127+
128+
const angularAppEngine = new AngularAppEngine()
129+
130+
export async function netlifyAppEngineHandler(request: Request): Promise<Response> {
131+
const context = getContext()
132+
133+
const result = await angularAppEngine.handle(request, context)
134+
return result || new Response('Not found', { status: 404 })
135+
}
136+
137+
/**
138+
* The request handler used by the Angular CLI (dev-server and during build).
139+
*/
140+
export const reqHandler = createRequestHandler(netlifyAppEngineHandler)
141+
```
142+
143+
### Limitations
144+
145+
The [`server.ts` file](https://angular.dev/guide/ssr#configure-server-side-rendering) that's part of the Angular scaffolding is meant for deploying to a VM, and is not compatible with this Netlify build plugin for Angular@17 and Angular@18. If you applied changes to that file, you'll need to replicate them in an Edge Function. See (#135)[https://github.com/netlify/angular-runtime/issues/135] for an example.
83146

84147
## CLI Usage
85148

demo.test.mjs

+2-4
Original file line numberDiff line numberDiff line change
@@ -6,14 +6,12 @@ test('edge function config', async () => {
66

77
assert.deepEqual(config.excludedPath, [
88
'/.netlify/*',
9-
'/dashboard/index.html',
109
'/favicon.ico',
1110
'/heroes/index.html',
1211
'/index.csr.html',
13-
'/main-QDJU6U55.js',
14-
'/polyfills-RX4V3J3S.js',
12+
'/main-UP4QHVAQ.js',
13+
'/polyfills-FFHMD2TL.js',
1514
'/styles-5INURTSO.css',
16-
'/dashboard',
1715
'/heroes',
1816
])
1917
})

demo/angular.json

+1-1
Original file line numberDiff line numberDiff line change
@@ -29,7 +29,7 @@
2929
],
3030
"scripts": [],
3131
"server": "src/main.server.ts",
32-
"prerender": true,
32+
"outputMode": "server",
3333
"ssr": {
3434
"entry": "server.ts"
3535
}

0 commit comments

Comments
 (0)