angular / angular/angular-cli

ng generate module produce wrong code for specific code pattern

Open
#15,923 0 comments 0 reactions 0 assignees View on GitHub
area: @schematics/angular freq1: low severity3: broken type: bug/fix
Dominant language
TypeScript
Stars
27k
Forks
11.8k
Avg merge
14h 23m
Merged PRs (30d)
162

Description

# 🐞 Bug report

### Command (mark with an `x`)

```
- [ ] new
- [ ] build
- [ ] serve
- [ ] test
- [ ] e2e
- [x] generate
- [ ] add
- [ ] update
- [ ] lint
- [ ] xi18n
- [ ] run
- [ ] config
- [ ] help
- [ ] version
- [ ] doc
```

### Is this a regression?

No.

### Description

The `ng generate module` produce wrong code.

## 🔬 Minimal Reproduction

```sh
ng new demo1 --routing --style css
cd demo1
ng g c test1
```

Add route config in `src/app/app-routing.module.ts` just like below:

```ts
const route1 = { path: 'test1', component: Test1Component };
const routes: Routes = [
route1
];
```

Then I creating an lazy-loaded module named `test`.

```sh
ng g module test --route test --module app
```

Then the route config will turn into this. And this is wrong.

```ts
const route1 = { path: 'test1', component: Test1Component };
const routes: Routes = [,
{ path: 'test', loadChildren: () => import('./test/test.module').then(m => m.TestModule) }
route1
];
```

## 🔥 Exception or Error



ERROR in Cannot read property 'loadChildren' of undefined

## 🌍 Your Environment



Angular CLI: 8.3.13
Node: 10.16.3
OS: win32 x64
Angular: 8.2.11
... animations, common, compiler, compiler-cli, core, forms
... language-service, platform-browser, platform-browser-dynamic
... router

Package Version
-----------------------------------------------------------
@angular-devkit/architect 0.803.13
@angular-devkit/build-angular 0.803.13
@angular-devkit/build-optimizer 0.803.13
@angular-devkit/build-webpack 0.803.13
@angular-devkit/core 8.3.13
@angular-devkit/schematics 8.3.13
@angular/cli 8.3.13
@ngtools/webpack 8.3.13
@schematics/angular 8.3.13
@schematics/update 0.803.13
rxjs 6.4.0
typescript 3.5.3
webpack 4.39.2

**Anything else relevant?**

Contributor guide

Open the contributing guide

Research direction

Reproduce the issue with the listed ng new, ng g c, and ng g module commands, then inspect src/app/app-routing.module.ts before and after generation. Done means the lazy-loaded route is inserted without invalid commas or dropped separators, while the existing route1 remains valid.

Written by the indexing model from the issue text.

Assessment

Tech stack
angular, typescript
Domain
cli, tooling
Issue type
Bug
Difficulty
3/5
Estimated time
1-2 days
Activity status
Stale
Clarity
Clearly specified
Newbie friendliness
35/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.