Codelyzer: Best way for multiple prefix rules

Created on 9 Sep 2016  Â·  9Comments  Â·  Source: mgechev/codelyzer

Is it possible to change prefixes for directory (without rewriting all rules)?

Styleguide says, that different modules can use different prefixes: toh-hero, admin-users.
https://angular.io/styleguide#!#02-07

Module versions
tslint: 3.13.0
codelyzer: 0.0.28

Now, I can write all prefixes in tslint.json in root directory.

"directive-selector-prefix": [true, "app", "toh", "admin"]
"component-selector-prefix": [true, "app", "toh", "admin"]

If I create app/heroes/tslint.ts, and write only rulesDirectory and prefixes rules, all other rules from ./tslint.ts will not work in app/heroes/ directory.

Example

./tslint.ts

{
  "rulesDirectory": [
    "node_modules/codelyzer"
  ],
  "rules": {
    ...
    "directive-selector-prefix": [true, "app"],
    "component-selector-prefix": [true, "app"],
    ...
  }
}

app/heroes/tslint.ts

{
  "rulesDirectory": [
    "../../node_modules/codelyzer"
  ],
  "rules": {
    "directive-selector-prefix": [true, "toh"],
    "component-selector-prefix": [true, "toh"],
  }
}

app/heroes/hero.component.ts

@Component({
  selector: 'toh-hero'
})
export class HeroComponent {}
enhancement help wanted

Most helpful comment

the tslint extends feature works for this:
I simply add a tslint.json file in the relevant folder like this
```
{
"extends": "../../../tslint.json",
"rules": {
"directive-selector": [true, "attribute", "av", "camelCase"],
"component-selector": [true, "element", "av", "kebab-case"],
"pipe-naming": [true, "camelCase", "av"]
}
}

All 9 comments

It should be possible to implement such behavior since we know the path of the file.

Lets keep the issue open and include it in the roadmap.

The following format makes sense to be used:

"selector-prefixes": {
    "./": ["app", "baz"], // use “app” or “baz” by default
    "./heroes": ["toh"],  // use “toh” prefix for all D&C in “./heroes” except…:
    "./heroes/bar": ["bar"], // use “bar” for all D&C in “./heroes/bar”
    "./humans": ["hu"] // use “hu” for all directives & components in “./human”
 }

The keys are the directory names, relative to the project root, and the values are list of prefixes.

@ValeryVS any opinion?

@mgechev
Looks good.

"./heroes/bar": ["bar"] will redeclare prefixes to this drectory, so using toh or app will not be valid.
If we want to use some default prefix, we need to add it.

"selector-prefixes": {
    "./": ["app", "baz", "demo"], // "demo" is one of default prefixes
    "./heroes": ["toh"], // we can't use "demo" here
    "./heroes/bar": ["bar", "demo"], // but here we can
    "./humans": ["hu"]
 }

Currently you can list a few prefixes in an array. In the next release, most likely we'll include directory specific prefixes.

It would be nice to allow the same behaviour for sufixes.
In Ionic2 app, most of the time you use the "Component" suffix in /components and "Page" in /pages.
It would reinforce the multi-suffix approach.

@TomDemulierChevret as mentioned in the previous issue, this is in master. I will be able to publish it as beta4 sometime next week.

the tslint extends feature works for this:
I simply add a tslint.json file in the relevant folder like this
```
{
"extends": "../../../tslint.json",
"rules": {
"directive-selector": [true, "attribute", "av", "camelCase"],
"component-selector": [true, "element", "av", "kebab-case"],
"pipe-naming": [true, "camelCase", "av"]
}
}

Following the feature request process that lodash has, I'm closing the issue and adding votes needed label.

Later we can prioritize the feature requests by popularity and include them in a future release.

@mgechev is there anything that hasn't been addressed for this issue yet or we can just remove the votes needed label?

Was this page helpful?
0 / 5 - 0 ratings

Related issues

artaommahe picture artaommahe  Â·  3Comments

michaeljota picture michaeljota  Â·  4Comments

lazarljubenovic picture lazarljubenovic  Â·  4Comments

lazarljubenovic picture lazarljubenovic  Â·  4Comments

wKoza picture wKoza  Â·  6Comments