How to add Custom prefix for components in Angular

1.3K    Asked by TheresaMackenzie in Python , Asked on Jan 30, 2020

There are no strict rules on prefix names. If you are using the CLI, you can edit the prefix node under apps in the angular-cli.json. This will make the cli create new components with whatever prefix you decide. For tslint.json you can set both component and directive rules:

"directive-selector": [true, "attribute", "app", "camelCase"],

"component-selector": [true, "element", "app", "kebab-case"],

If you want to use more than one prefix, you can specify them in an array like this:

//RULES: [ENABLED, "attribute" | "element", "selectorPrefix" | ["listOfPrefixes"], "camelCase" | "kebab-case"]

"directive-selector": [true, "attribute", ["dir-prefix1", "dir-prefix2"], "camelCase"],

"component-selector": [true, "element", ["cmp-prefix1", "cmp-prefix2"], "kebab-case"],

In the array, the first argument is a boolean for whether it is enabled or not.

The second argument is a union type with choices attribute or element.

The third argument is either a string for a single prefix or an array for a list of prefixes.

And the fourth argument is a union type of either kebab-case or camelCase

Your Answer


Parent Categories