Error message in Visual Studio 2017: Identical name 'URLs' declared twice in

Question

Error message in Visual Studio 2017: Identical name 'URLs' declared twice in

In our Visual Studio 2017 project, we have multiple TypeScript files that define a URLs class. Each file contains different implementations of the class to change site URLs based on the specific use case:

customer/urls.ts

namespace Portal {
    export class URLs {
        static homePage(): string { return "/customer"; }
    }
}

supplier/urls.ts

namespace Portal {
    export class URLs {
        static homePage(): string { return "/supplier"; }
    }
}

This approach leads to a "Duplicate identifier 'URLs'" error in Visual Studio 2017. The IDE assumes that all TypeScript files will be included in the webpage, causing the conflict. However, since only one file is pulled in for any given page, there is no actual duplicate identifier in the browser. How can this error be resolved in Visual Studio or is there a valid reason behind it?

typescript visual-studio-2017

Answer 1

Answer №1

This situation arises from a combination of factors:

Typescript namespaces, also known as "internal modules," contribute to the global namespace. Starting a file with a non-exported namespace declaration makes that identifier available globally. In contrast, modules (or "external modules") require explicit importing and exporting. Refer to this explanation for more details.
If specific files are not explicitly included or excluded in your tsconfig.json, both definitions for Portal.URLs will be included. According to the tsconfig.json documentation:

In scenarios where "files" and "include" are not defined, the compiler includes all TypeScript (.ts, .d.ts, and .tsx) files within the directory and subdirectories unless specified otherwise using the "exclude" property.

Hence, the duplicate identifier error is caused by the compiler attempting to add the same declaration to the global namespace twice.

The appropriate solution depends on how the class is used and how the decision is made regarding which implementation to utilize.

One possible solution is to avoid namespaces entirely. Instead, you could define a URLs interface, import it where necessary, and then choose between a CustomerURLs or SupplierURLs implementation based on environmental variables or build configurations.

Alternatively, you could create a base tsconfig.json and use extends to generate separate configuration files like tsconfig.customer.json or tsconfig.supplier.json. In each individual file, exclude all **/urls.ts files except for the relevant one. However, this approach may not be very scalable, and its impact on VS's intellisense functionality is unclear.

Answer 2

This situation arises from a combination of factors:

Typescript namespaces, also known as "internal modules," contribute to the global namespace. Starting a file with a non-exported namespace declaration makes that identifier available globally. In contrast, modules (or "external modules") require explicit importing and exporting. Refer to this explanation for more details.
If specific files are not explicitly included or excluded in your tsconfig.json, both definitions for Portal.URLs will be included. According to the tsconfig.json documentation:

In scenarios where "files" and "include" are not defined, the compiler includes all TypeScript (.ts, .d.ts, and .tsx) files within the directory and subdirectories unless specified otherwise using the "exclude" property.

Hence, the duplicate identifier error is caused by the compiler attempting to add the same declaration to the global namespace twice.

The appropriate solution depends on how the class is used and how the decision is made regarding which implementation to utilize.

One possible solution is to avoid namespaces entirely. Instead, you could define a URLs interface, import it where necessary, and then choose between a CustomerURLs or SupplierURLs implementation based on environmental variables or build configurations.

Alternatively, you could create a base tsconfig.json and use extends to generate separate configuration files like tsconfig.customer.json or tsconfig.supplier.json. In each individual file, exclude all **/urls.ts files except for the relevant one. However, this approach may not be very scalable, and its impact on VS's intellisense functionality is unclear.

Error message in Visual Studio 2017: Identical name 'URLs' declared twice in

Answer №1

Similar questions

What could be causing the TypeScript type error within this Effector effect subscriber?

Failed to decipher an ID token from firebase

New Entry failing to appear in table after new record is inserted in CRUD Angular application

`mat chip component in Angular Material is malfunctioning`

Utilize PrimeNG's async pipe for lazy loading data efficiently

NativeScript: TypeScript for Formatting Numbers

Sharing references in React Native using TypeScript: The (property) React.MutableRefObject<null>.current is potentially null

Leveraging TypeScript to call controller functions from a directive in AngularJS using the "controller as"

Identifying the state type within the scope of TypeScript

What is the best way to incorporate an exported TypeScript class into my JavaScript file?

Incorporate a typescript library into your Angular application

What is the best way to allocate string types from an enum using Typescript?

Add a npm module without type definitions

Another return payload failing to retrieve the return value

I'm experiencing some difficulties utilizing the return value from a function in Typescript

How to target a particular Textfield in React with its unique identifier

Show the value in Angular in a dynamic way

Guide on setting up next-auth for external API login in a Next.js 13 app directory

When using VS Code, custom.d.ts will only be recognized if the file is currently open in the

Something went wrong in the prerender.ts file at line 7. The error message is indicating that it cannot locate the module './dist-prerender/main.bundle'