I encounter an issue when trying to declare an enum in TypeScript

At line 26 in my typescript file, the code snippet below shows an enum definition:

export enum ItemType {
  Case = 'Case',
  Study = 'Study',
  Project = 'Project',
  Item = 'Item',
}

I am currently using Visual Studio Code as my IDE. Linting flags an error stating 

'ItemType' is already declared in the upper scope on line 26 column 13.eslint(no-shadow)

The only other usage of ItemType in the file is within an interface definition as shown below:

export interface Item {
  // other fields here

  readonly type: ItemType;
}

No other part of my project defines anything called 'ItemType', which adds to the confusion of this error message. Can you help me understand why this error occurs and how I can resolve it?

typescript

Answer №1

To disable the standard no-shadow linting rule and switch to the typescript-eslint counterpart, follow these steps:

Simply include the following in your eslint setup:


...
"no-shadow": "off",
"@typescript-eslint/no-shadow": ["error"],
...

Answer №2

After investigating further, I managed to recreate the issue with the @typescript-eslint/parser in a bare-bones environment using your code. It seems like there may be discrepancies in the linting rules or style guides you're currently following. To resolve this issue, I made modifications to the eslintrc.js file by adding the following rules:

"rules": {
    "no-shadow": "off",
    "@typescript-eslint/no-shadow": "off"
}

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Triggering an event from a higher-level component to a lower-level component

Within the parent component named personDetails, there is a Submit button. This parent component contains multiple child components called person`. Each time I click on the Submit button, I need to trigger a method within the child component. Is it possib ...

angulartypescript

Retrieve data that resets to undefined upon reloading from an array

Encountering an unusual error while working with TypeScript for the first time. Initially, when I use console.log(data), it displays an array with objects. However, upon reloading the webpage without making any changes, the console log shows undefined. con ...

javascriptreactjstypescript

After upgrading from Angular 7 to 12, the module './rest.service.interface' does not export 'RestService' (imported as 'RestService'), causing it to not be found

Hey everyone, I've been struggling with a problem for hours now and I can't seem to fix it. Here is the interface I'm working with: import { HttpClient } from '@angular/common/http'; import { Response } from '@angular/http&apo ...

angulartypescript

The custom native date adapter is facing compatibility issues following the upgrade of Angular/Material from version 5 to 6

In my Angular 5 application, I had implemented a custom date adapter as follows: import {NativeDateAdapter} from "@angular/material"; import {Injectable} from "@angular/core"; @Injectable() export class CustomDateAdapter extends NativeDateAdapter { ...

angulartypescriptangular-materialangular-material2angular-material-6

What is the best way to combine properties from Type1 and Type2 to create a new type in Typescript?

Here is a snippet of code I'm working with: interface Notification { message: TemplatedEmail & Email, //current attempt which doesnt do what I want } interface Destination { ccAddresses?: string[], bccAddresses?: string[], toAddresses: st ...

typescript

Steps for incorporating a type declaration for an array of objects in a React application with TypeScript

How can I specify the type for an array of objects in React using TypeScript? Here is the code snippet: const SomeComponent = (item: string, children: any) => { //some logic } In this code, you can see that I am currently using 'any' as ...

reactjstypescript

executing afterEach in multiple specification files

Seeking a solution to execute shared code across tests in various spec files in Playwright using TypeScript. Specifically, I need to upload test results based on the testInfo. While I know that fixtures can achieve this, it's not the most efficient op ...

typescriptplaywright-typescript

Using TypeScript's conditional types for assigning types in React

I'm tasked with creating a component that can belong to two different types. Let's call them Type A = { a: SomeCustomType } Type B = { b: SomeOtherDifferentType } Based on my understanding, I can define the type of this component as function C ...

reactjstypescripttypes

Retrieving data from an API using VUEJS3 and Typescript

I am facing an issue with displaying data in my template. When I try to do so, the screen remains blank. I am using Vue.js 3 with TypeScript and I am fairly new to this technology. <template> <div> <img :src="datas[0].imag ...

typescriptvue.jsvuejs3

Determine characteristics of object given to class constructor (typescript)

My current scenario involves the following code: abstract class A { obj; constructor(obj:{[index:string]:number}) { this.obj = obj; } } class B extends A { constructor() { super({i:0}) } method() { //I wan ...

typescript

"Encountering a module not found issue while trying to

Attempting to test out 3 node modules locally by updating their source locations in the package.json files. The modules in question are sdk, ng-widget-lib, and frontend. ng-widget-lib relies on sdk, while frontend depends on ng-widget-lib. To locally build ...

node.jsangulartypescriptnpm

Tips for retrieving JSON files within karma tests

I am currently working on developing a test for my TypeScript class that involves retrieving data from a JSON file. readData<T>(filePath: string): Promise<T> { return Qajax.getJSON(filePath); } For testing purposes, I am utilizing the Jas ...

jsontypescriptjasminekarma-runner

Combine both typescript and javascript files within a single Angular project

Is it feasible to include both TypeScript and JavaScript files within the same Angular project? I am working on a significant Angular project and considering migrating it to TypeScript without having to rename all files to .ts and address any resulting er ...

javascriptangularjstypescript

Make sure to implement validations prior to sending back the observable in Angular

Each time the button is clicked and if the modelform is invalid, a notification message should be returned instead of proceeding to create a user (createUser). The process should only proceed with this.accountService.create if there are no form validation ...

javascriptangulartypescriptvalidationrxjs

Ways to manage multiple Observables

Two Observables are being returned from different services, each providing only one value (similar to Observable.just()). In TypeScript, types play a crucial role in this context. Is there a method to determine when both Observables have been resolved (in ...

javascripttypescriptrxjsrxjs5

Build upon a class found in an AngularJS 2 library

Whenever I attempt to inherit from a class that is part of a library built on https://github.com/jhades/angular2-library-example For example, the class in the library: export class Stuff { foo: string = "BAR"; } And the class in my application: exp ...

angulartypescript

SvelteKit is having trouble with identifying Typescript syntax

I was working on a SvelteKit project with TypeScript (set up with Vite) and everything was running smoothly with "npm run dev". However, when I attempted to publish the app on Github Pages, an error popped up (on localhost) as I hovered over the only link ...

typescripttypeerrorsveltevercelsveltekit

Import statements cannot be used outside of a module when working with a private npm package in cucumber.js

Utilizing cucumberjs to test various components of my project has been successful. However, I encountered an issue in one step where I utilize a zod schema that is defined within a private npm module: // within the private npm package: // constant.js impor ...

typescriptcucumberjs

Stop WebStorm from automatically importing code from a different Angular project within the same workspace

I currently have an angular repository that consists of two projects: a library and an Angular application. To link the library to my project, I utilized the npm link command. Within the package.json file, I specified the entry as follows: ... "my-lib ...

angulartypescriptwebstorm

Collaborate and apply coding principles across both Android and web platforms

Currently, I am developing a web version for my Android app. Within the app, there are numerous utility files such as a class that formats strings in a specific manner. I am wondering if there is a way to write this functionality once and use it on both ...

javascriptjavaandroidtypescriptweb