What is @angular/platform-browser-dynamic?
The @angular/platform-browser-dynamic npm package provides methods for bootstrapping Angular applications in a browser environment with Just-In-Time (JIT) compilation. This package is typically used for development purposes, as it compiles the application dynamically in the browser, allowing for a faster development cycle. However, for production builds, Ahead-Of-Time (AOT) compilation is preferred for performance reasons, which is handled by the @angular/platform-browser package.
What are @angular/platform-browser-dynamic's main functionalities?
Bootstrapping Angular Modules
This code snippet demonstrates how to bootstrap an Angular module using the platformBrowserDynamic function. It imports the AppModule and then calls the bootstrapModule method to initialize the application.
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
import { AppModule } from './app/app.module';
platformBrowserDynamic().bootstrapModule(AppModule)
.catch(err => console.error(err));
Other packages similar to @angular/platform-browser-dynamic
@angular/platform-browser
This package provides tools for running Angular applications in a web browser with Ahead-Of-Time (AOT) compilation. Unlike @angular/platform-browser-dynamic, it is optimized for production by pre-compiling templates to make the application load faster and be more performant.
react-dom
Similar to @angular/platform-browser-dynamic for Angular, react-dom is used for bootstrapping and rendering React applications in the browser. It provides the entry point to the DOM and server renderers for React and can be considered an equivalent in the React ecosystem.
vue
The Vue.js framework has a similar package for bootstrapping and rendering Vue applications in the browser. It provides the functionality to create and mount the root Vue instance to the DOM, similar to how Angular applications are bootstrapped with @angular/platform-browser-dynamic.
19.0.0-next.0 (2024-08-14)
Breaking Changes
core
-
Errors that are thrown during ApplicationRef.tick
will now be rethrown when using TestBed
. These errors should be
resolved by ensuring the test environment is set up correctly to
complete change detection successfully. There are two alternatives to
catch the errors:
- Instead of waiting for automatic change detection to happen, trigger
it synchronously and expect the error. For example, a jasmine test
could write
expect(() => TestBed.inject(ApplicationRef).tick()).toThrow()
TestBed
will reject any outstanding ComponentFixture.whenStable
promises. A jasmine test,
for example, could write expectAsync(fixture.whenStable()).toBeRejected()
.
As a last resort, you can configure errors to not be rethrown by
setting rethrowApplicationErrors
to false
in TestBed.configureTestingModule
.
router
- The
Router.errorHandler
property has been removed.
Adding an error handler should be configured in either
withNavigationErrorHandler
with provideRouter
or the errorHandler
property in the extra options of RouterModule.forRoot
. In addition,
the error handler cannot be used to change the return value of the
router navigation promise or prevent it from rejecting. Instead, if you
want to prevent the promise from rejecting, use resolveNavigationPromiseOnError
. - The return type of the
Resolve
interface now includes
RedirectCommand
.
core
| Commit | Type | Description |
| -- | -- | -- |
| 468d3fb9b1 | fix | rethrow errors during ApplicationRef.tick in TestBed (#57200) |
router
| Commit | Type | Description |
| -- | -- | -- |
| f271021e19 | feat | Add routerOutletData
input to RouterOutlet
directive (#57051) |
| b2790813a6 | fix | Align RouterModule.forRoot errorHandler with provider error handler (#57050) |
| 7436d3180e | fix | Update Resolve interface to include RedirectCommand like ResolveFn (#57309) |
<!-- CHANGELOG SPLIT MARKER -->
<a name="18.2.0"></a>