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(@angular/build): introduce outputMode option to the application builder #28355

Merged
merged 1 commit into from
Sep 19, 2024

Conversation

alan-agius4
Copy link
Collaborator

@alan-agius4 alan-agius4 commented Sep 5, 2024

The outputMode option defines the build output target, offering two modes:

  • 'static': Generates a static site suitable for deployment on any static hosting service. This mode can produce a fully client-side rendered (CSR) or static site generated (SSG) site. When SSG is enabled, redirects are handled using the <meta> tag.
  • 'server': Produces an application designed for deployment on a server that supports server-side rendering (SSR) or a hybrid approach.

Additionally, the outputMode option determines whether the new API is used. If enabled, it bundles the server.ts as a separate entry point, preventing it from directly referencing main.server.ts and excluding it from localization.

This option will replace appShell and prerendering when server routing configuration is present.

closes #27356
closes #27403
closes #25726
closes #25718
closes #27196

@angular-robot angular-robot bot added detected: feature PR contains a feature commit area: @angular/build labels Sep 5, 2024
@alan-agius4 alan-agius4 added the target: major This PR is targeted for the next major release label Sep 5, 2024
@alan-agius4 alan-agius4 force-pushed the wireup-ssr-output-mode branch 2 times, most recently from f90791f to 7d2f132 Compare September 5, 2024 10:02
@alan-agius4 alan-agius4 force-pushed the wireup-ssr-output-mode branch 5 times, most recently from 28a16ca to a3f50d5 Compare September 13, 2024 06:16
@alan-agius4 alan-agius4 force-pushed the wireup-ssr-output-mode branch from a3f50d5 to ac71ce1 Compare September 13, 2024 09:04
@angular-robot angular-robot bot removed the detected: feature PR contains a feature commit label Sep 13, 2024
@alan-agius4 alan-agius4 reopened this Sep 13, 2024
@angular-robot angular-robot bot added the detected: feature PR contains a feature commit label Sep 13, 2024
@alan-agius4 alan-agius4 force-pushed the wireup-ssr-output-mode branch 7 times, most recently from 859f6b9 to 3814f19 Compare September 17, 2024 08:01
@alan-agius4 alan-agius4 force-pushed the wireup-ssr-output-mode branch 6 times, most recently from 5c30f3d to 23c32aa Compare September 17, 2024 08:53
@alan-agius4 alan-agius4 requested a review from clydin September 17, 2024 09:05
@alan-agius4 alan-agius4 marked this pull request as ready for review September 17, 2024 09:05
@alan-agius4 alan-agius4 added the action: review The PR is still awaiting reviews from at least one requested reviewer label Sep 17, 2024
@alan-agius4 alan-agius4 force-pushed the wireup-ssr-output-mode branch 6 times, most recently from 8e1a54c to d33ec81 Compare September 18, 2024 13:37
@alan-agius4 alan-agius4 force-pushed the wireup-ssr-output-mode branch 4 times, most recently from 655b76a to 3974957 Compare September 19, 2024 07:59
@alan-agius4 alan-agius4 requested a review from clydin September 19, 2024 16:52
tests/legacy-cli/e2e/tests/server-rendering/setup.ts Outdated Show resolved Hide resolved
Comment on lines +209 to +215
if (options.prerender) {
context.logger.warn(
'The "prerender" option is no longer needed when "outputMode" is specified.',
);
} else {
options.prerender = !!options.server;
}
Copy link
Member

Choose a reason for hiding this comment

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

Looks like when prerender is false here, it will be ignored. Is that intentional?

Copy link
Collaborator Author

@alan-agius4 alan-agius4 Sep 19, 2024

Choose a reason for hiding this comment

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

Yeah, both prerender and appshell options are unused with the new API. As prerendering and app-shell is controlled through the routes config.

@alan-agius4 alan-agius4 force-pushed the wireup-ssr-output-mode branch from 3974957 to f01d2da Compare September 19, 2024 17:06
…n builder

The `outputMode` option accepts two values:
- **`static`:**  Generates a static output (HTML, CSS, JavaScript) suitable for deployment on static hosting services or CDNs. This mode supports both client-side rendering (CSR) and static site generation (SSG).
- **`server`:** Generates a server bundle in addition to static assets, enabling server-side rendering (SSR) and hybrid rendering strategies. This output is intended for deployment on a Node.js server or serverless environment.

- **Replaces `appShell` and `prerender`:**  The `outputMode` option simplifies the CLI by replacing the `appShell` and `prerender` options when server-side routing is configured.
- **Controls Server API Usage:**  `outputMode` determines whether the new server API is utilized. In `server` mode, `server.ts` is bundled as a separate entry point, preventing direct references to `main.server.ts` and excluding it from localization.

Closes angular#27356, closes angular#27403, closes angular#25726, closes angular#25718 and closes angular#27196
@alan-agius4 alan-agius4 force-pushed the wireup-ssr-output-mode branch from f01d2da to 5de4d93 Compare September 19, 2024 19:13
@alan-agius4 alan-agius4 added action: merge The PR is ready for merge by the caretaker and removed action: review The PR is still awaiting reviews from at least one requested reviewer labels Sep 19, 2024
@alan-agius4 alan-agius4 merged commit 3b00fc9 into angular:main Sep 19, 2024
31 checks passed
@alan-agius4 alan-agius4 deleted the wireup-ssr-output-mode branch September 19, 2024 19:29
@Blunderchips
Copy link

Are there any example on how to use this?

@patricsteiner
Copy link

@alan-agius4 So glad this is finally solved, thank you! When will it be released? And could you please provide an example how to setup an ssr app with i18n enabled, so we can get rid of the workaround mentioned here: #25726
Thx :)

@alan-agius4
Copy link
Collaborator Author

@patricsteiner, this is part of Angular version 19 which is currently in pre-release. The schematics will be updated to use the new API. In the meantime you can check this test for an example.

@angular-automatic-lock-bot
Copy link

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

This action has been performed automatically by a bot.

@angular-automatic-lock-bot angular-automatic-lock-bot bot locked and limited conversation to collaborators Oct 31, 2024
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.