【Ng Alain】 遇到的提示语报错 及修改 TypeScript （TSLint）配置

刚入门 【Ng Alain】 书写代码，遇到关于（TSLint）报错，上网搜到一些解决方案，在此整合下，也希望对跟大家会有些帮助。

TypeScript （TSLint）编码规范报错，需在 tslint.json 中修改配置，根据个人编码习惯选择性修改

 

小收获：

eg: [tslint] file should end with a newline (eofline)

大部分相关 [tslint] 报错，可根据报错内容中括号内的名称 eofline，到配置文件中搜索相关配置进行修改。

 

Q: 组建选择器命名时缺少前缀报错： [tslint] The selector of the component "ImageWrapperComponent" should have one of the prefixes "app, passport, exception, layout, header" (https://angular.io/styleguide#style-02-07) (component-selector)

1. 添加配置中所配置的前缀可解决报错

@Component({
    selector: 'app-image-wrapper',
    template: `
    <div [ngStyle]="style" >
        <img class="img" [src]="src" [alt]="desc" />
        <div *NgIf="desc" class="desc">{{desc}}</div>
    </div>`,
    styleUrls: [ './index.less' ]
})

2. 修改 component-selector 为 false 命名不需要添加前缀

"component-selector": [
      false,
      "element",
      [
        "app",
        "passport",
        "exception",
        "layout",
        "header"
      ],
      "kebab-case"
    ]
  }

 

 

Q: 引用格式报错：[tslint] " should be ' (quotemark)

1. 将报错位置的 双引号 替换为 单引号可解决

2. 修改 quotemark 为 false 可解决，其规定了引用符号的格式，比如在 true 的模式下，就会强制规定引用时必须使用单引号。

"quotemark": [
      false,
      "single"
    ],

 

 

Q: 缺少空格报错：[tslint] missing whitespace (one-line)

1. 在相应位置加上空格可解决

2. 修改 one-line 为 false 可解决报错位置因缺少空格而报的错

"one-line": [
      false,
      "check-open-brace",
      "check-catch",
      "check-else",
      "check-whitespace"
    ],

 

 

Q: 缺少分号报错：[tslint] Missing semicolon (semicolon)

1. 在相应位置添加分号可解决

2. 修改 semicolon 为 false 可解决

"semicolon": [
      false,
      "always"
    ],

 

 

Q: 尾部多余空格报错：[tslint] trailing whitespace (no-trailing-whitespace)

1. 将代码尾部多余的空格删除可解决

2. 修改 no-trailing-whitespace 为 false 可解决

"no-trailing-whitespace": false,

 

 

Q: 注释开头缺少空格报错： [tslint] comment must start with a space (comment-format)

1. 再注释开头加上空格可解决

2. 修改 comment-format 为 false 可解决，如果check-space这一项存在，那么注释行的开头必须要加上一个空格

"comment-format": [
      false,
      "check-space"
    ],

 

 

Q: 代码结尾不以空行结束报错：[tslint] file should end with a newline (eofline)

1. 在代码结尾打上空行可解决

2. 修改 eofline 为 false 可解决

"eofline": false,