Angular-cli: Ng update forces double quotemark

[aescarcha]

🐞 Bug report

Command (mark with an x)

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

Is this a regression?

Probably, I used ng update several times already and this never happened

Description

After running ng update to update from 7.3 to 8.0.0-rc.5 I get a big amount of tslint errors because it used double quotes (") on the modified imports. IE:

-import { MatDialogModule } from '@angular/material';
+import { MatDialogModule } from "@angular/material/dialog";

All the changed imports are from material, so I can't say if it's only an issue with material

🔬 Minimal Reproduction

run ng update --next in any angular project using material

🌍 Your Environment

Angular CLI: 7.3.9
Node: 10.13.0
OS: darwin x64
Angular: 8.0.0-rc.5
... animations, common, compiler, compiler-cli, core, forms
... language-service, platform-browser, platform-browser-dynamic
... platform-server, router

Package                           Version
-----------------------------------------------------------
@angular-devkit/architect         0.13.1
@angular-devkit/build-angular     0.13.1
@angular-devkit/build-optimizer   0.13.1
@angular-devkit/build-webpack     0.13.1
@angular-devkit/core              7.3.1
@angular-devkit/schematics        7.3.9
@angular/cdk                      8.0.0-rc.2
@angular/cli                      7.3.9
@angular/http                     7.2.15
@angular/material                 8.0.0-rc.2
@ngtools/webpack                  7.3.1
@schematics/angular               7.3.9
@schematics/update                0.13.9
rxjs                              6.5.2
typescript                        3.4.5
webpack                           4.29.0

[alan-agius4]

This is somewhat related to the convo I had with @devversion last week over here https://github.com/angular/components/issues/16086

[devversion]

Yeah. Linking to the related Material issue as well: https://github.com/angular/components/issues/16035#issuecomment-493176528

[clydin]

As an aside, StringLiteral nodes do have an internal property (singleQuote) that can be used to force the use of a single quote when printing.

[devversion]

Thanks @clydin for mentioning this. We actually had a conversation about this in the components channel but we never got to the point of double-checking if the printer actually respects these.

https://github.com/microsoft/TypeScript/blob/6a559e37ee0d660fcc94f086a34370e79e94b17a/src/compiler/utilities.ts#L584-L590

I will spend some time looking into this now.

[devversion]

Something we also had to look into was the additional whitespace that is added to the ts.NamedImports. This is something that also deviates from the existing import that is rewritten. Ideally we'd really just run the TslintFix task for the generated/updated files to match the project rules.

[clydin]

I'm actually thinking a post-generate/add/update schematic _hook_ may be the ultimate solution with the hook passing a list of the modified/created files. Similar to a lint-staged/husky setup for git. This would allow the project to use whatever formatter desired (e.g., tslint, eslint, prettier, etc.).

[Splaktar]

The Angular Material part of this was fixed for 8.0.0 via https://github.com/angular/components/commit/a3856c7c9916d82733393f5b982c3c50b5c60a15.

[devversion]

I think we should update this issue to be more generic. i.e. talk about lint failures generally caused by arbitrary schematics.

The proposal should be that lint fix runs automatically after any generate schematic. That would also simplify the --lint-fix flag for @schematics/angular generate schematics.

[Splaktar]

It would be good to triage this issue as well (priority, etc) so that it gets some attention. While not super-severe, this seems to be a frequent problem.