How to add Custom prefix for components in Angular

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