1

angular プロジェクトを正常に更新された Angular v11 に更新しました。これにより、非推奨の警告TSLintが表示され、ここで概説されている手順に従ってください - Codelyzer および TSLintからの移行 私はこれを移行することができました。

この更新の後、この1つのエラーを除いて、解決方法のアイデアがあるいくつかのエラーを受け取りました

 Error: Debug Failure. False expression: position cannot precede the beginning of the file
    at computeLineOfPosition (C:\Path\to\Project\node_modules\typescript\lib\typescript.js:8934:22)
    at computeLineAndCharacterOfPosition (C:\Path\to\Project\node_modules\typescript\lib\typescript.js:8912:26)
    at Object.getLineAndCharacterOfPosition C:\Path\to\Project\node_modules\typescript\lib\typescript.js:8953:16)
    at SourceFileObject.getLineAndCharacterOfPosition (C:\Path\to\Project\node_modules\typescript\lib\typescript.js:143309:23)
    at preprocess (C:\Path\to\Project\node_modules\@angular-eslint\eslint-plugin-template\dist\index.js:1:1430)
    at Linter._verifyWithProcessor (C:\Path\to\Project\node_modules\eslint\lib\linter\linter.js:1292:30)
    at Linter._verifyWithConfigArray (C:\Path\to\Project\node_modules\eslint\lib\linter\linter.js:1264:25)
    at Linter.verify (C:\Path\to\Project\node_modules\eslint\lib\linter\linter.js:1226:25)
    at Linter.verifyAndFix (C:\Path\to\Project\node_modules\eslint\lib\linter\linter.js:1416:29)
    at verifyText (C:\Path\to\Project\node_modules\eslint\lib\cli-engine\cli-engine.js:239:48)
preprocess: ERROR could not parse @Component() metadata C:\Path\to\Project\src\app\components\label-star-required\label-star-required.component.ts
Error: Debug Failure. False expression: position cannot precede the beginning of the file
    at computeLineOfPosition (C:\Path\to\Project\node_modules\typescript\lib\typescript.js:8934:22)
    at computeLineAndCharacterOfPosition (C:\Path\to\Project\node_modules\typescript\lib\typescript.js:8912:26)
    at Object.getLineAndCharacterOfPosition (C:\Path\to\Project\node_modules\typescript\lib\typescript.js:8953:16)
    at SourceFileObject.getLineAndCharacterOfPosition (C:\Path\to\Project\node_modules\typescript\lib\typescript.js:143309:23)
    at preprocess (C:\Path\to\Project\node_modules\@angular-eslint\eslint-plugin-template\dist\index.js:1:1430)
    at Linter._verifyWithProcessor (C:\Path\to\Project\node_modules\eslint\lib\linter\linter.js:1292:30)
    at Linter._verifyWithConfigArray (C:\Path\to\Project\node_modules\eslint\lib\linter\linter.js:1264:25)
    at Linter.verify (C:\Path\to\Project\node_modules\eslint\lib\linter\linter.js:1226:25)
    at Linter.verifyAndFix (C:\Path\to\Project\node_modules\eslint\lib\linter\linter.js:1416:29)
    at verifyText (C:\Path\to\Project\node_modules\eslint\lib\cli-engine\cli-engine.js:239:48)
preprocess: ERROR could not parse @Component() metadata C:\Path\to\Project\src\app\components\skip-link\skip-link.component.ts

以下は、このエラーをスローする 2 つのコンポーネントです。

label-star-required.component.ts

import {Component} from '@angular/core';

@Component({
  selector: 'app-label-star-required',
  templateUrl: './label-star-required.component.html',
  styleUrls: ['./label-star-required.component.css']
})
export class LabelStarRequiredComponent {
  constructor() {
  }
}

@Component({
  selector: 'app-star-required',
  template: `
    <span class='icon-star required'></span>
  `,
  styleUrls: ['./label-star-required.component.css']
})

export class StarRequiredComponent {
  constructor() {
  }
}

スキップ-link.component.ts

import { Component, OnInit, OnDestroy } from '@angular/core';
import { Router, NavigationStart } from '@angular/router';
import { filter, takeWhile, map } from 'rxjs/operators';
@Component({
  selector: 'app-skip-link',
  styleUrls: ['./skip-link.component.css'],
  template: `
    <a [href]="skipLinkPath" class="skip-main">Skip to main content</a>
  `
})
export class SkipLinkComponent implements OnInit, OnDestroy {
  skipLinkPath: string;
  componentIsActive: boolean;
  constructor(
    private router: Router
  ) { }
  ngOnInit() {
    this.componentIsActive = true;
    this.skipLinkPath = `${this.router.url.replace('#main', '')}#main`;
    this.router.events.pipe(filter(event => event instanceof NavigationStart))
      .pipe(takeWhile(() => this.componentIsActive))
      .pipe(map(event => (event as any).url ))
      .subscribe(url => {
        if (!/(.)#main$/.test(url)) {
          this.skipLinkPath = `${url}#main`;
        }

      });
  }
  ngOnDestroy() {
    this.componentIsActive = false;
  }
}

上記の 2 つのコンポーネントから、共通の類似点は、両方のファイルが inline を使用していることですtemplate: 。これが実行中にエラーを引き起こしている可能性がありますng lintか? これを解決するにはどうすればよいですか？

4

3 に答える 3