标签: tslint

我正在使用TSLint来检查我的 Angular TypeScript 代码。我启用了no-unsafe-any规则，因为对我来说，永远不要对 type 的属性做出任何假设似乎是一个很好的规则any。

问题是该规则报告了我的某些代码的错误，除了禁用该规则之外，我无法以任何方式修复该错误。根据下面的规则无效的代码示例。

public intercept(request: HttpRequest<{}>, next: HttpHandler): Observable<HttpEvent<{}>> {
  return next
    .handle(request)
    .pipe(
      catchError(error => {
        if (error && error.status === httpCodeUnauthorized) {
          // Auto logout if unathorized
          this.authenticationService.logout();
        }

        const errorMessage = (error.error && error.error.message) || error.statusText;

        return throwError(errorMessage);
      }),
    );
}

Linter 报告 2 行 4 个错误：

ERROR: /home/robert/programming/npc/gui/src/app/core/authentication/unauthorized.interceptor.ts[24, 24]: Unsafe use of expression of type 'any'.
ERROR: /home/robert/programming/npc/gui/src/app/core/authentication/unauthorized.interceptor.ts[29, 33]: Unsafe use of expression of type 'any'. …

当组件克隆其子组件并向其注入 props 时，如何定义子组件的 props 类型？

我收到错误原因injectedProps预计在Child

const Parent: React.SFC<ParentProps> = ({ children }) => (
  <div>
    {React.cloneElement(children[0], { injectedProp: 'foo' })}
  </div>
);

const Child: React.SFC<ChildProps> = ({ injectedProp }) => (
  <div attr={injectedProp} />
);

type ChildProps = {
  injectedProp: string;
};

<Parent>
  <Child />
</Parent>

子项错误：injectedProp缺失

最近从 C# 迁移到 TypeScript。下面的代码工作正常并且没有错误。然而我怀疑我还没有理解一些 TS 基础知识，因为我们只是定义接口并像对象/类一样使用它们。声明接口中定义的类型的变量，然后将该变量分配给其自己的类型对象的正确方法是什么。

let tempCompany = Company|undefined; 
// I get error if I remove undefined in above line.
// Company is an interface with many properties
tempCompany = this.someArrayOfCompanies.find(x => x.zipCode === 65432);
if (tempCompany !== undefined) { 
    // error if I do not do this if check in above line
    console.log(tempCompany.SalesFigure);
}

更新：根据下面的反馈可能的答案。对于像我这样从 .Net/C# 转向 TS 的新手来说，会产生困惑，因为在 C# 中，我们将接口命名为 IAnimal()，然后有一个名为 Dog 的类实现 IAnimal()。在 TS 中，我们有 Animal 接口（没有 I），它的命名是为了让 TS 智能感知能够在 VS Code 中工作。另外，当你的 api 进入 Angular …

我已经用 in ts 编写了 js 代码。但现在我有一些 lint 错误链接。

  4:1  error  ES2015 module syntax is preferred over custom TypeScript modules and namespaces  typescript/no-namespace
  4:1  error  Use 'namespace' instead of 'module' to declare custom TypeScript modules         typescript/prefer-namespace-keyword

我已经这样声明了

declare global {
  interface Window {
    aa: any;
  }
}

和使用like一样，就可以了，但是只是调用lint错误

if (typeof window.aa !== 'undefined') {
  // dosth
}

我无法理解错误消息，并且我已阅读文档，但仍然对其感到困惑

在我的 tslint.json 中我有这个：

"typedef": [true, "call-signature", "parameter"],
"no-inferrable-types": [true, "ignore-params"],

因为我想强制函数具有返回类型并且参数具有类型，但这迫使我在推断参数上具有类型。例子：

即使开始和结束被推断为数字，这也会失败：

transform(start = 6, end = 4): number {
    return;
}

有没有办法强制参数只有在未像示例那样初始化时才具有类型？

这应该通过：

transform(start = 6, end = 4): number {
    return;
}

这应该会失败：

transform(start, end): number {
    return;
}

例子：

class MyClass {
  public log(): void {
    console.log(this);
  }
}

单元测试.js

const instance = new MyClass();
expect(instance.log).toHaveBeenCalled(); 

尝试进行单元测试时避免引用未绑定方法错误。使用箭头函数比在 linting 中添加“白名单”选项更好吗？任何帮助将不胜感激

我有使用的简单组件styled-components和utils.tsx包含主题颜色的文件。我通过 WebpackProvidePlugin 加载它，因为我不想在每个组件文件中包含 React 和 styled-components 模块。它可以正常工作、渲染、编译，但我在控制台和编辑器中出现一些 TS 错误，因为 typescript 编译器/解析器无法识别 webpack 别名

TS2686：“React”指的是 UMD 全局，但当前文件是一个模块。考虑添加导入。

TS2304：找不到名称“Styled”。

TS2304：找不到名称“颜色”。

导航.tsx

const Nav = Styled.nav`
    height: 64px;
    background-color: ${Color.darkBlue};
`

function Navigation() {
    return <Nav>dwa</Nav>
}

export default Navigation

webpack.config.js

...
        new webpack.ProvidePlugin({
            React: 'react',
            Device: [
                path.resolve(path.join(__dirname, 'src/utils/utils.tsx')),
                'devices',
            ],
            Color: [
                path.resolve(path.join(__dirname, 'src/utils/utils.tsx')),
                'colors',
            ],
            Styled: ['styled-components', 'default'],
        }),
...

tsconfig.json

{
    "compilerOptions": {
        "module": "none",
        "moduleResolution": "node",
        "jsx": "react",
        "target": "es6",
        "lib": ["es2015", "dom", "dom.iterable"], …

我在反应本机项目中有这个文件：

import styled, { withTheme } from 'styled-components';
import { BaseText } from '../BaseText';

export interface BodyProps {
  textAlign?: string;
  fontSize?: string;
}

export const Body = withTheme(styled(BaseText)<BodyProps>`
  text-align: ${props => (props.textAlign ? props.textAlign : 'center')};
  font-size: ${props => (props.fontSize ? props.fontSize : '16px')};
`);

withTheme我将 React Native 从 0.61.5 升级到 0.63.2，并开始在使用的任何地方出现此 lint 错误：

TS2742：如果不引用“react-native/node_modules/@types/react”，就无法命名“Body”的推断类型。这可能不可移植。类型注释是必要的。

我尝试了几种方法，但错误仍然存​​在：

1. 在这篇文章之后，我添加了import React from "react";
2. 尝试通过在声明/* tslint:disable */上方添加来禁用 tslintBody
3. 尝试通过在声明// tslint:disable-next-line上方添加来禁用 tslintBody
4. 使用依赖版本。目前我有"@types/react": "^16.9.49" …

您能否建议我如何在 TypeScript 项目中打开已弃用的 API 检测？我使用 Visual Studio 代码。我已经做了什么：

• 安装的eslint：yarn add eslint -D
• 安装了 eslint-plugin-deprecate：yarn add eslint-plugin-deprecate -D
• 安装了 typescript-eslint：yarn add -D typescript @typescript-eslint/parser @typescript-eslint/eslint-plugin
• 创建了一个包含以下内容的 .eslintrc 文件：

{
    "plugins": [
        "@typescript-eslint",
        "deprecate"
    ],
    "parser": "@typescript-eslint/parser",
    "extends": [
        "eslint:recommended",
        "plugin:@typescript-eslint/eslint-recommended",
        "plugin:@typescript-eslint/recommended"
    ]
}

然后我eslint . --ext .ts在终端中运行命令，尽管我的代码使用了已弃用的 API，但没有出现预期的错误或警告：

const audioContext = new AudioContext();
const processor = audioContext.createScriptProcessor(2048, 1, 1);
//onaudioprocess is deprecated
processor.onaudioprocess = event => {
    console.log(event);
    //...
}

按照Angular ESLint的说明，我已成功将另一个带有单个项目的 Angular 10 应用程序从 TSLint 迁移到 ESLint 。当我尝试在项目/文件夹（即“app”和“myLib”）下迁移具有多个项目的 Angular 10 应用程序并尝试运行“ng lint”或“npx ng lint app”时，我只看到“Linting” app"...' 并且该命令似乎挂起。所有必需的软件包均已安装，并且迁移阶段没有错误。对这个问题有什么想法吗？