Skip to content

Commit 35f2b3f

Browse files
AvcharovAvcharov
authored
feat: update to angular v21 (#561)
Closes: #552 --- ## Changes by Nx Migrations (automatic) | Change | Migration | Reason | |--------|-----------|--------| | `module: "preserve"`, `moduleResolution: "bundler"` | `update-module-resolution-22-2-0` | Aligns with esbuild/Vite build system | | `lib: ["dom", "es2022"]` | `update-typescript-lib-22-2-0` | Enables ES2022 features | | `isolatedModules: true` in tsconfig.spec.json | `set-isolated-modules-22-3-0` | Required by modern bundlers | | `tsConfig` in project.json | `set-tsconfig-option` | Explicit path for reliability | | `BootstrapContext` in main.server.ts | `add-bootstrap-context-to-server-main` | Angular 21 SSR requirement | --- ## Changes by Storybook 10 Migration (automatic) | Change | Reason | |--------|--------| | `module.exports` → `export default` | Storybook 10 requires ESM | | `addon-essentials` → `addon-docs` | Essential features now in core | | Added `docs: { autodocs: true }` | New autodocs config format | --- ## Manual Changes for Storybook 10 | Change | Reason | |--------|--------| | `type: "module"` in library package.json | Avoids ESM warnings | | `jsx: "react"`, `skipLibCheck: true` in .storybook/tsconfig.json | Fixes MDX/JSX compilation errors | | `declarations` → `imports` in stories | Angular 20+ components are standalone by default | | Removed `@storybook/core-server` | Incompatible with Storybook 10 | --- ## Manual Changes for Angular 21 | Change | Reason | |--------|--------| | Peer dependencies → `^21.1.0` | Library requires Angular 21+ | --- <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **Chores** * Upgraded Angular framework and dependencies from version 20 to 21.1.2 for improved compatibility and stability. * Updated build tooling, development dependencies, and project configurations to align with Angular 21 ecosystem standards. * Enhanced Storybook setup and TypeScript compilation configuration. <!-- end of auto-generated comment: release notes by coderabbit.ai -->
1 parent 631e924 commit 35f2b3f

14 files changed

Lines changed: 9146 additions & 12868 deletions

File tree

‎apps/ngu-carousel-example/src/main.server.ts‎

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,8 @@
1-
import { bootstrapApplication } from '@angular/platform-browser';
1+
import { bootstrapApplication, BootstrapContext } from '@angular/platform-browser';
22
import { AppComponent } from './app/app.component';
33
import { config } from './app/app-server.config';
44

5-
const bootstrap = () => bootstrapApplication(AppComponent, config);
5+
const bootstrap = (context: BootstrapContext) =>
6+
bootstrapApplication(AppComponent, config, context);
67

78
export default bootstrap;

‎apps/ngu-carousel-example/tsconfig.json‎

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,9 @@
11
{
22
"compilerOptions": {
3-
"target": "ES2022"
3+
"target": "ES2022",
4+
"module": "preserve",
5+
"moduleResolution": "bundler",
6+
"lib": ["dom", "es2022"]
47
},
58
"files": [],
69
"include": [],

‎apps/ngu-carousel-example/tsconfig.spec.json‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,8 @@
33
"compilerOptions": {
44
"outDir": "../../dist/out-tsc",
55
"types": ["jasmine", "node"],
6-
"moduleResolution": "bundler"
6+
"moduleResolution": "bundler",
7+
"isolatedModules": true
78
},
89
"files": ["src/test.ts"],
910
"include": ["src/**/*.spec.ts", "src/**/*.d.ts"]

‎libs/ngu/carousel/.storybook/main.js‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
1-
module.exports = {
2-
stories: ['../**/*.stories.mdx', '../**/*.stories.@(js|jsx|ts|tsx)'],
3-
addons: ['@storybook/addon-essentials'],
1+
export default {
2+
stories: ['../src/**/*.stories.@(js|jsx|ts|tsx)', '../src/**/*.stories.mdx'],
3+
addons: ['@storybook/addon-docs'],
44
framework: {
55
name: '@storybook/angular',
66
options: {}

‎libs/ngu/carousel/.storybook/tsconfig.json‎

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,10 @@
11
{
22
"extends": "../tsconfig.json",
33
"compilerOptions": {
4-
"emitDecoratorMetadata": true
4+
"emitDecoratorMetadata": true,
5+
"jsx": "react",
6+
"esModuleInterop": true,
7+
"skipLibCheck": true
58
},
69

710
"exclude": ["../**/*.spec.ts"],

libs/ngu/carousel/karma.conf.js renamed to libs/ngu/carousel/karma.conf.cjs

File renamed without changes.

‎libs/ngu/carousel/package.json‎

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,11 @@
11
{
22
"name": "@ngu/carousel",
33
"version": "20.0.1",
4+
"type": "module",
45
"peerDependencies": {
5-
"@angular/common": "^20.0.0",
6-
"@angular/core": "^20.0.0",
7-
"@angular/animations": "^20.0.0",
6+
"@angular/common": "^21.1.0",
7+
"@angular/core": "^21.1.0",
8+
"@angular/animations": "^21.1.0",
89
"hammerjs": "^2.0.0",
910
"rxjs": "^7.0.0"
1011
},

‎libs/ngu/carousel/project.json‎

Lines changed: 4 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -8,15 +8,14 @@
88
"build": {
99
"executor": "@nx/angular:package",
1010
"options": {
11-
"project": "libs/ngu/carousel/ng-package.json"
11+
"project": "libs/ngu/carousel/ng-package.json",
12+
"tsConfig": "libs/ngu/carousel/tsconfig.lib.json"
1213
},
1314
"configurations": {
1415
"production": {
1516
"tsConfig": "libs/ngu/carousel/tsconfig.lib.prod.json"
1617
},
17-
"development": {
18-
"tsConfig": "libs/ngu/carousel/tsconfig.lib.json"
19-
}
18+
"development": {}
2019
},
2120
"defaultConfiguration": "production"
2221
},
@@ -25,7 +24,7 @@
2524
"options": {
2625
"main": "libs/ngu/carousel/src/test.ts",
2726
"tsConfig": "libs/ngu/carousel/tsconfig.spec.json",
28-
"karmaConfig": "libs/ngu/carousel/karma.conf.js",
27+
"karmaConfig": "libs/ngu/carousel/karma.conf.cjs",
2928
"polyfills": ["zone.js", "zone.js/testing"]
3029
}
3130
},

‎libs/ngu/carousel/src/lib/ngu-item/ngu-item.component.stories.ts‎

Lines changed: 14 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,20 @@
1-
import { Meta } from '@storybook/angular';
1+
import { Meta, StoryObj, moduleMetadata } from '@storybook/angular';
22
import { NguItemComponent } from './ngu-item.component';
33

4-
export default {
5-
title: 'NguItemComponent',
6-
component: NguItemComponent
7-
} as Meta<NguItemComponent>;
4+
const meta: Meta<NguItemComponent> = {
5+
title: 'Carousel/NguItem',
6+
component: NguItemComponent,
7+
decorators: [
8+
moduleMetadata({
9+
imports: [NguItemComponent]
10+
})
11+
]
12+
};
13+
14+
export default meta;
15+
type Story = StoryObj<NguItemComponent>;
816

9-
export const Primary = {
17+
export const Primary: Story = {
1018
render: (args: NguItemComponent) => ({
1119
props: args
1220
}),

‎libs/ngu/carousel/src/lib/ngu-tile/ngu-tile.component.stories.ts‎

Lines changed: 14 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,20 @@
1-
import { Meta } from '@storybook/angular';
1+
import { Meta, StoryObj, moduleMetadata } from '@storybook/angular';
22
import { NguTileComponent } from './ngu-tile.component';
33

4-
export default {
5-
title: 'NguTileComponent',
6-
component: NguTileComponent
7-
} as Meta<NguTileComponent>;
4+
const meta: Meta<NguTileComponent> = {
5+
title: 'Carousel/NguTile',
6+
component: NguTileComponent,
7+
decorators: [
8+
moduleMetadata({
9+
imports: [NguTileComponent]
10+
})
11+
]
12+
};
13+
14+
export default meta;
15+
type Story = StoryObj<NguTileComponent>;
816

9-
export const Primary = {
17+
export const Primary: Story = {
1018
render: (args: NguTileComponent) => ({
1119
props: args
1220
}),

0 commit comments

Comments
 (0)