feat(@schematics/angular): enable routing by default for new applications

This commits updates the `routing` option in the `ng new` and `ng generation application` schematics to `true` by default and also removed the `Would you like to add Angular routing?` prompt.

BREAKING CHANGE: Routing is enabled by default for new applications when using `ng generate application` and `ng new`. The `--no-routing` command line option can be used to disable this behaviour.
This commit is contained in:
Alan Agius 2023-09-08 11:16:11 +00:00 committed by Alan Agius
parent b3b478798e
commit 1a6a139aaf
10 changed files with 15 additions and 48 deletions

View File

@ -31,7 +31,6 @@ describe('Application Schematic', () => {
const defaultOptions: ApplicationOptions = {
name: 'foo',
routing: false,
skipPackageJson: false,
};
@ -566,8 +565,8 @@ describe('Application Schematic', () => {
expect(component).toMatch(/standalone: true/);
});
it('should create routing information when routing is true', async () => {
const options = { ...defaultOptions, standalone: true, routing: true };
it('should create routing information by default', async () => {
const options = { ...defaultOptions, standalone: true };
const tree = await schematicRunner.runSchematic('application', options, workspaceTree);

View File

@ -39,9 +39,8 @@
},
"routing": {
"type": "boolean",
"description": "Create a routing NgModule.",
"default": false,
"x-prompt": "Would you like to add Angular routing?",
"description": "Creates an application with routing enabled.",
"default": true,
"x-user-analytics": "ep.ng_routing"
},
"prefix": {

View File

@ -51,6 +51,7 @@ describe('Ng New Schematic', () => {
jasmine.arrayContaining([
'/bar/tsconfig.app.json',
'/bar/src/main.ts',
'/bar/src/app/app.routes.ts',
'/bar/src/app/app.config.ts',
]),
);

View File

@ -91,7 +91,7 @@
},
"routing": {
"type": "boolean",
"description": "Generate a routing module for the initial project.",
"description": "Enable routing in the initial project.",
"x-user-analytics": "ep.ng_routing"
},
"prefix": {

View File

@ -31,6 +31,7 @@ describe('standalone utilities', () => {
{
name: projectName,
standalone,
routing: false,
},
host,
);

View File

@ -58,6 +58,7 @@ export default async function () {
'src/app/app.module.ts': `
import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { RouterModule } from '@angular/router';
import { AppComponent } from './app.component';
@ -66,6 +67,7 @@ export default async function () {
AppComponent
],
imports: [
RouterModule,
BrowserModule
],
providers: [],
@ -95,7 +97,7 @@ export default async function () {
'src/app/app.module.ts': `
import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { RouterModule } from '@angular/router';
import { AppComponent } from './app.component';
@NgModule({
@ -103,6 +105,7 @@ export default async function () {
AppComponent
],
imports: [
RouterModule,
BrowserModule
],
providers: [],

View File

@ -6,7 +6,7 @@
* found in the LICENSE file at https://angular.io/license
*/
import { appendToFile, prependToFile, readFile, replaceInFile, writeFile } from '../../utils/fs';
import { readFile, replaceInFile, writeFile } from '../../utils/fs';
import { ng } from '../../utils/process';
import { updateJsonFile } from '../../utils/project';
@ -14,30 +14,6 @@ export default async function () {
const projectName = 'test-project';
const appRoutingModulePath = 'src/app/app-routing.module.ts';
// Add app routing.
// This is done automatically on a new app with --routing.
await writeFile(
appRoutingModulePath,
`
import { NgModule } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';
const routes: Routes = [];
@NgModule({
imports: [RouterModule.forRoot(routes)],
exports: [RouterModule]
})
export class AppRoutingModule { }
`,
);
await prependToFile(
'src/app/app.module.ts',
`import { AppRoutingModule } from './app-routing.module';`,
);
await replaceInFile('src/app/app.module.ts', `imports: [`, `imports: [ AppRoutingModule,`);
await appendToFile('src/app/app.component.html', '<router-outlet></router-outlet>');
const originalAppRoutingModule = await readFile(appRoutingModulePath);
// helper to replace loadChildren
const replaceLoadChildren = async (route: string) => {

View File

@ -25,6 +25,7 @@ export default async function () {
`
import {NgModule} from '@angular/core';
import {BrowserModule} from '@angular/platform-browser';
import {RouterModule} from '@angular/router';
import {SecondaryModule} from 'mylib/secondary';
import {AnotherModule} from 'mylib/another';
@ -35,6 +36,7 @@ export default async function () {
AppComponent
],
imports: [
RouterModule,
SecondaryModule,
AnotherModule,
BrowserModule

View File

@ -1,14 +0,0 @@
import { ng } from '../../utils/process';
import { expectFileToExist, moveFile } from '../../utils/fs';
import { getGlobalVariable } from '../../utils/env';
import * as path from 'path';
export default function () {
const tmp = getGlobalVariable('tmp-root');
return Promise.resolve()
.then(() => moveFile('node_modules/@angular/router', path.join(tmp, '@angular-router.backup')))
.then(() => ng('build', '--configuration=development'))
.then(() => expectFileToExist('./dist/test-project/index.html'))
.then(() => moveFile(path.join(tmp, '@angular-router.backup'), 'node_modules/@angular/router'));
}

View File

@ -45,5 +45,5 @@ export default async function () {
await expectFileToMatch(`dist/test-project/${mainPath}`, bootstrapRegExp);
// Size checks in bytes
verifySize(mainPath, 124000);
verifySize(mainPath, 210000);
}