Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat!: add support for Angular v17 #67

Merged
merged 34 commits into from
Nov 8, 2023
Merged

feat!: add support for Angular v17 #67

merged 34 commits into from
Nov 8, 2023

Conversation

Skn0tt
Copy link
Contributor

@Skn0tt Skn0tt commented Nov 6, 2023

This PR contains a big overhaul of our Angular Plugin, adding support for Angular v17. (I was sneaky and found the release candidates!)

As part of this, we're massively simplifying the plugin. We generate an edge function that thinly wraps around the output generated by ng build, there's no mangling with angular.json required anymore.

We're also renaming the package to @netlify/angular-runtime, to be more in-line with our other framework plugin names.

Copy link

netlify bot commented Nov 6, 2023

Deploy Preview for plugin-angular-universal-demo ready!

Name Link
🔨 Latest commit 0a43c8f
🔍 Latest deploy log https://app.netlify.com/sites/plugin-angular-universal-demo/deploys/654b63d1931b840008a917ce
😎 Deploy Preview https://deploy-preview-67--plugin-angular-universal-demo.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

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

@github-actions github-actions bot added the type: feature code contributing to the implementation of a feature and/or user facing functionality label Nov 6, 2023
package.json Outdated
@@ -23,18 +22,18 @@
"prepublishOnly:pull": "git pull",
"prepublishOnly:install": "npm ci",
"prepublishOnly:test": "npm test",
"test": "jest"
"test": "# no tests"
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

All the tests we had covered behaviour I had to remove, so i've removed the test script for now.

src/index.js Outdated Show resolved Hide resolved
@Skn0tt
Copy link
Contributor Author

Skn0tt commented Nov 7, 2023

@Skn0tt Skn0tt marked this pull request as ready for review November 7, 2023 07:38
@Skn0tt Skn0tt self-assigned this Nov 7, 2023
@Skn0tt Skn0tt requested a review from ascorbic November 7, 2023 07:38
Copy link
Contributor

@ascorbic ascorbic left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Great that you've been able to simplify it so much! I have a few questions and comments

src/helpers/setUpEdgeFunction.js Outdated Show resolved Hide resolved
src/helpers/setUpEdgeFunction.js Outdated Show resolved Hide resolved
src/helpers/setUpEdgeFunction.js Outdated Show resolved Hide resolved
src/helpers/setUpEdgeFunction.js Show resolved Hide resolved
src/helpers/validateAngularVersion.js Outdated Show resolved Hide resolved
src/helpers/validateAngularVersion.js Outdated Show resolved Hide resolved
package.json Outdated
"version": "1.0.1",
"description": "Netlify Build plugin Angular Universal - Run Angular Universal seamlessly on Netlify.",
"name": "@netlify/angular-runtime",
"version": "2.0.0",
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

release-please should handle the versioning, though you may need to bootstrap it as a new package. I don't think it should be 2.0.0 though, as it's a new package so semver doesn't apply

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Let's stick with 2.0.0 so that the Git tags in this repo don't clash.

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

If rlewase-please is setup ok then you shouldn't update this here: the breaking change will trigger a major bump anyway

package.json Outdated Show resolved Hide resolved
@Skn0tt Skn0tt requested a review from ascorbic November 7, 2023 13:17
@Skn0tt
Copy link
Contributor Author

Skn0tt commented Nov 7, 2023

I believe i've implemented everything necessary! Noice. Looking forward to release this :D

@Skn0tt Skn0tt requested a review from tzmanics November 7, 2023 13:19
const ssrFunction = `
import "./polyfill.mjs";
import { Buffer } from "node:buffer";
import { renderApplication } from "${toPosix(relative(edgeFunctionDir, serverDistRoot))}/render-utils.server.mjs";
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I think you can do path.posix.relative() rather than implementing it yourself

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I can, but edgeFunctionDir and serverDistRoot will contain windows-style separators on windows. Not sure if path.posix.relative() know how to deal with them

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Ah, good point

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Screenshot 2023-11-07 at 14 41 47

don't think that will work

Copy link
Contributor

@ascorbic ascorbic left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

🎉

@Skn0tt
Copy link
Contributor Author

Skn0tt commented Nov 7, 2023

31b44b9 ensures that this also works out-of-the-box for ng create without --ssr.

"src/styles.css"
],
"scripts": [],
"server": "src/main.server.ts",
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

manually verified that changing this doesn't change the output file name, so it's fine to depend on that in our generated edge function.

README.md Outdated
To test this in local development, run your Angular project using `netlify serve`:

```sh
netlify serve --dir dist/demo/browser
Copy link
Contributor Author

@Skn0tt Skn0tt Nov 8, 2023

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

we can remove --dir here once netlify/cli#6133 lands

@Skn0tt
Copy link
Contributor Author

Skn0tt commented Nov 8, 2023

Added a way of working with netlify.request and netlify.context locally.

@Skn0tt Skn0tt requested a review from ascorbic November 8, 2023 10:34
@Skn0tt
Copy link
Contributor Author

Skn0tt commented Nov 8, 2023

@ascorbic could I bother you with one more review on the changes since you last looked? I've added a couple things, and am happy with the state of things now.

@Skn0tt
Copy link
Contributor Author

Skn0tt commented Nov 8, 2023

Gonna move forward and merge this now, so I can fix any bugs that release-please might have. Feel free to still review, so we can address in a follow-up.

@Skn0tt Skn0tt merged commit ab92862 into main Nov 8, 2023
8 checks passed
@token-generator-app token-generator-app bot mentioned this pull request Nov 8, 2023
@mrstork mrstork deleted the ng-17 branch May 30, 2024 15:09
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
type: feature code contributing to the implementation of a feature and/or user facing functionality
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants