Angular CLI (ng) use single instead of double quotes

Question

When I use the 'ng generate' commands, it's writing my import statements using quotes for the path. I would like it to instead use single quotes. Is it possible to configure this somehow?

Answer 1

You currently (as of 7.1) cannot configure Angular to generate components and other entities with quotes of your choice. It currently uses single quotes. If you are not happy with this, you can tell it to automatically run tslint and fix all the issues automatically after generation.

First, make sure you have rule for enforcing double quotes in your tslint.json:

"quotemark": [true, "double"],

Next, in your angular.json in the schematic section (on root level), you can provide option lintFix which tells angular to autofix generated files based on your tslint config:

"schematics": {
    "@schematics/angular:component": {
      "prefix": "app",
      "styleext": "scss",
      "lintFix": true
    },
    "@schematics/angular:directive": {
      "prefix": "app",
      "lintFix": true
    },
    "@schematics/angular:pipe": {
      "lintFix": true
    },
    "@schematics/angular:class": {
      "lintFix": true
    },
    "@schematics/angular:module": {
      "lintFix": true
    },
    "@schematics/angular:service": {
      "lintFix": true
    }
  }

This should work well on linux, but on Windows, there is currently bug, which uses wrong file path when generating. Until it is fixed, you cannot generate components directly in your components directory, but you rather need to generate it in the project root and specify in the command path to the directory where it should be generated:

ng g component components/my-component my-component

Answer 2

There are scripts available that do that; I am looking at this right now.

If your concern comes from a complaining linter though, you could always change the linter's config file.

In Visual Studio Code, for example, a popular linter plugin is tslint. Here you would simply change this setting:

    "quotemark": [
    true,
    "single"
  ]

to

    "quotemark": [
    true,
    "double"
  ]

in the tslint.json file

Hope that helps.