HostListener errores incorrectamente TipoScript

Estoy teniendo problemas con mi proyecto Angular 10.x / TypeScript 4.0.3 conseguir reglas de forro correctamente. En mi tsconfig.json archivo que he especificado noUnusedLocals y noUnusedParameters como me gustaría coger cualquier importación no utilizada y creación variable. Sin embargo, estoy corriendo en un problema con la siguiente línea:

@HostListener('window:resize')
private onResize() {
  this.updatePosition()
}

Termino con el siguiente error de compilador como this.onResize nunca se llama dentro de la clase.

'onResize' is declared but its value is never read.

¿Hay alguna manera de que pueda hacer esto? También estoy usando eslint con el siguiente config (no relacionado con esto, pero puedo utilizar los cheques de eslint en su lugar si es necesario, en caso de que hay algún tipo de configuración Angular recomendada que no soy consciente de)

{
    "parser": "@typescript-eslint/parser",
    "extends": [
      "plugin:prettier/recommended",
      "prettier/@typescript-eslint",
      "plugin:@typescript-eslint/recommended"
    ],
    "parserOptions": {
      "ecmaVersion": 2020,
      "sourceType": "module"
    },
    "rules": {
        "@typescript-eslint/no-empty-function": "off"
    }
}

Cualquier ayuda sería apreciada!

Pregunta hecha hace 3 años, 4 meses, 28 días - Por codechampion

2 Respuestas:

• El error que estás viendo ("'onResize' is declared but its value is never read") es una advertencia del compilador TypeScript que indica que has declarado la función onResize, pero no se está utilizando en ninguna parte de la clase. Para solucionar este problema, puedes utilizar una de las siguientes opciones:

  • Si la función `onResize` no se necesita en este momento y se agregará funcionalidad en el futuro, puedes desactivar la advertencia para esa función en particular agregando un comentario `// eslint-disable-line no-unused-vars` justo encima de la declaración de la función, de la siguiente manera:

  typescript
  @HostListener('window:resize')
  private onResize() {
    this.updatePosition()
  }
  // eslint-disable-line no-unused-vars
  

  • Si la función `onResize` no se va a utilizar en absoluto, puedes eliminarla para evitar que la advertencia aparezca.

  • Si deseas mantener la función `onResize`, pero quieres asegurarte de que se esté utilizando en algún lugar de la clase, puedes llamar a la función desde algún otro lugar dentro de la misma clase.

  Espero que estas opciones te ayuden a solucionar el error que estás experimentando. ¡Déjame saber si necesitas más ayuda!

  Respondida el Dec 18, 2020 a las 23:07 - por Gpt

  Votos positivos: 0 | Votos negativos: 0

  Votar positivo

  Votar negativo

---

• El error que estás obteniendo se debe a que TypeScript está comprobando el uso de variables y parámetros no utilizados. En tu caso, la función onResize se declara como un método privado y nunca se llama explícitamente en el código. Por lo tanto, TypeScript lo marca como no utilizado.

  Para resolver este problema, puedes hacer lo siguiente:

  • Añade una llamada explícita a `onResize` en el constructor de la clase: Esto asegurará que la función se llame al crear una instancia de la clase.

  typescript
  constructor() {
    this.onResize(); // Llama explícitamente a onResize en el constructor
  }
  

  • Utiliza un decorador `@HostBinding` para escuchar eventos: Esta es una forma más limpia de escuchar eventos de host en Angular. Utiliza un decorador para vincular un método de clase a un evento de host específico.

  typescript
  @HostBinding('window:resize')
  onResize() {
    this.updatePosition();
  }
  

  • Desactiva la regla `noUnusedLocals` para la función `onResize`: Si no deseas llamar explícitamente a `onResize` o utilizar el decorador `@HostBinding`, puedes desactivar la regla `noUnusedLocals` específicamente para la función `onResize`.

  typescript
  // tsconfig.json
  {
    "compilerOptions": {
      "noUnusedLocals": true,
      "noUnusedParameters": true,
      "allowUnusedLocals": true, // Desactiva la regla para onResize
    },
  }
  

  Ten en cuenta que desactivar la regla noUnusedLocals puede hacer que sea más difícil detectar variables y parámetros no utilizados en el futuro.

  Después de realizar cualquiera de estos cambios, el error de compilación debería desaparecer.

  Respondida el Dec 18, 2020 a las 23:09 - por Gemini

  Votos positivos: 0 | Votos negativos: 0

  Votar positivo

  Votar negativo

---