Skip to content

Prettier config in package.json overrides singleQuote for .ts files in --minimal projects #30744

@steven-panxd

Description

@steven-panxd

Command

new

Is this a regression?

  • Yes, this behavior used to work in the previous version

The previous version in which this bug was not present was

20.0.3

Description

After @angular/[email protected], the following Prettier configuration was introduced in package.json via PR #30590, related to issue #30548 and commit 2316fe2:

"prettier": {
    "overrides": [
      {
        "files": "*.html",
        "options": {
          "parser": "angular"
        }
      }
    ]
  }

This works well in standard Angular templates, which include an .editorconfig file in the root folder. However, in the --minimal template, there is no .editorconfig file, yet the same Prettier configuration is still present in package.json.

I’ve noticed that in --minimal projects, this Prettier override seems to cause TypeScript files to format using double quotes, even when my Prettier settings specify singleQuote: true. As soon as I remove the overrides block, Prettier respects the single quote rule again in .ts files.

This seems unintended, as the override is only targeting *.html files.

Image

Minimal Reproduction

To reproduce the issue, install the latest version of Angular CLI and create a project using:

ng new <project-name> --minimal

Then open any .ts file and try saving it. You’ll observe that all single quotes are replaced with double quotes, as demonstrated in the GIF above.

Exception or Error


Your Environment

Angular CLI: 20.1.1
Node: 22.14.0
Package Manager: npm 11.4.2
OS: darwin arm64

Angular:
...

Package                      Version
------------------------------------------------------
@angular-devkit/architect    0.2001.1 (cli-only)
@angular-devkit/core         20.1.1 (cli-only)
@angular-devkit/schematics   20.1.1 (cli-only)
@schematics/angular          20.1.1 (cli-only)


esbenp.prettier-vscode version 11.0.0

Anything else relevant?

I tested with an older version of Angular CLI, specifically v20.0.3 (before commit 2316fe2), and the issue did not occur there.

As a workaround, I added an additional overrides entry in package.json to explicitly force Prettier to use single quotes for .ts files:

"prettier": {
    "overrides": [
      {
        "files": "*.html",
        "options": {
          "parser": "angular"
        }
      },
      {
        "files": "*.ts",
        "options": {
          "singleQuote": true
        }
      }
    ]
  }

Image

This seems to restore the expected formatting behavior for TypeScript files, though I’m not certain whether this workaround could introduce unintended side effects. Further testing would be helpful.

Metadata

Metadata

Assignees

No one assigned

    Type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions