Codelyzer: component-selector rule does not work as expected

Created on 29 Aug 2018  路  3Comments  路  Source: mgechev/codelyzer

Hello.

I tried this with node v8.11.4 and v.10.9.0 and Angular6

Steps to reproduce are the following:

  • Create project

        ng new marbug-app
    
  • Go to project folder

        cd marbug-app
    
  • Generate home module

        ng g module home
    
  • Generate home component

        ng g component home
    
  • Change prefix in marbug-app/angular.json from app to marbug:

          "root": "",
          "sourceRoot": "src",
          "projectType": "application",
    -     "prefix": "app",
    +     "prefix": "marbug",
          "schematics": {},
          "architect": {
            "build": {
    
  • Change component selector prefix in marbug-app/src/app/home/home.component.ts file from app to marbug:

            @Component({
    -         selector: 'app-home',
    +         selector: 'marbug-home',
              templateUrl: './home.component.html',
              styleUrls: ['./home.component.css']
            })
    
  • Add component-selector rule to marbug-app/tslint.json

         "no-output-rename": true,
         "use-life-cycle-interface": true,
         "use-pipe-transform-interface": true,
    +    "component-selector": [true, "element", "marbug", "kebab-case"],
         "component-class-suffix": true,
         "directive-class-suffix": true
       }
    
  • Run

    npm run lint
    
  • See error

    ERROR: /Users/marbug/cpp/angular/test-lint/marbug-app/src/app/home/home.component.ts[4, 13]: The selector of the component "HomeComponent" should have prefix "app" (https://angular.io/styleguide#style-02-07)
    
    Lint errors found in the listed files.
    
  • Expected behavior: there is no such error

P.S. Please take a look for more details at
https://github.com/marbug/test-lint/blob/master/v8.11.4/README.md
https://github.com/marbug/test-lint/blob/master/v10.9.0/README.md

Most helpful comment

the root of the issue: the additional marbug-app/src/tslint.json file has been automatically generated, which also has component-selector rule by default, and it redefines component-selector rule from marbug-app/tslint.json by default prefix. Sorry for disturbing. Closing the issue...

All 3 comments

Thanks for the detailed description. We'll take a look at this in the next few days.

the root of the issue: the additional marbug-app/src/tslint.json file has been automatically generated, which also has component-selector rule by default, and it redefines component-selector rule from marbug-app/tslint.json by default prefix. Sorry for disturbing. Closing the issue...

No worries.

Was this page helpful?
0 / 5 - 0 ratings

Related issues

artaommahe picture artaommahe  路  3Comments

fabioemoutinho picture fabioemoutinho  路  5Comments

jamesbirtles picture jamesbirtles  路  3Comments

davidanaya picture davidanaya  路  4Comments

michaeljota picture michaeljota  路  4Comments