Creating container objects that mimic singletons... and ensuring tslint stays satisfied

Recently, I integrated tslint into my TypeScript project to ensure adherence to code styling rules. While the process has been relatively smooth, there is one particular aspect that still raises questions for me.

Within my codebase, I have instances where I utilize a singleton-like object encapsulating properties and functions. For instance:

function open(x) {...};
function close(x) {...};
let isOpen = false;

export const MainMenu {
    open,
    close,
    isOpen
};

The predicament arises when tslint flags the naming of 'MainMenu' due to enforcing camelCase variable conventions. In most cases, adhering to this convention is logical; however, in scenarios similar to this, where uppercase names are customary (Math, Reflect, etc.), the necessity becomes ambiguous.

So, what approach should be taken here? Should I disable the rule selectively or consider utilizing the concept of 'namespace'? Nonetheless, employing external modules complicates matters, potentially hindering the seamless addition of property members.

I would greatly appreciate any insights or advice on how best to proceed with this issue.

Answer №1

It appears that utilizing a namespace or an external module may be a more suitable approach in this scenario. This would allow for better organization and structure within your codebase.

If however, you decide to proceed with the current method and aim to satisfy TSLint requirements, a quick solution would involve temporarily disabling the variable-name rule:

/* tslint:disable:variable-name */
export const MainMenu {
    open,
    close,
    isOpen
};
/* tslint:enable:variable-name */

(Please note that you can adjust the re-enabling comment placement for improved readability.)

Furthermore, there is an ongoing feature request to exclude specific variables from this rule directly in your tslint.json configuration file. This alternative may become available in future updates!

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

Mapped Generics in Typescript allows you to manipulate and

Currently, I am attempting to utilize TypeScript generics in order to transform them into a new object structure. Essentially, my goal is to change: { key: { handler: () => string }, key2: { hander: () => number }, } to: ...

Yarn workspaces encounter an unexpected token error when exporting enums

I am currently working on a typescript project with the following structure: root/ packges/ client/ <-- Built with CRA server/ domain/ src/models package.json tsconfig.json webpack.config.js When trying to import a ...

Unveiling the method of retrieving a targeted value from JWT in React

I'm struggling to retrieve a specific value from my JWT token in React. I am using the react-jwt library to decode the token, and when I log it, I receive this output: Object { userId: "850dff98-54fb-4059-9e95-e44f5c30be0f", iat: 1698866016 ...

Error: Template Update Required Due to Observable Value Change - Fixing the ExpressionChangedAfterItHasBeenCheckedError

After searching through numerous SO posts in search of a solution, I finally stumbled upon one that involved a hacky implementation. The issue at hand involves an observable extracted from the ngrx store which I then subscribe to: this.navigationSelected$ ...

Tips for passing an object by value to an Angular2+ component

Imagine having a scenario where I create a component that takes a Foo instance and generates a form for editing. export class ChildComponent implements OnInit { @Input() foo : Foo; @Output() onChange : EventEmitter<Foo> = new EvenEmitter<Foo& ...

What is the process of creating a typeorm relationship between orders and products?

My Orders Entity file in TypeOrm looks like this: @Entity('orders') export class OrdersEntity { @PrimaryGeneratedColumn('uuid') id: string; @CreateDateColumn() created: Date; @UpdateDateColumn() updated: Date; @Column('t ...

Load images dynamically based on their filenames

As I continue to learn, I am working on a delivery layout project. I have come across a section where I need to load Cards with restaurant information. The names are displaying correctly, but I am facing issues with loading the images. I am using a JSON fi ...

Unexpected halt in execution - VS Code Logpoint intervenes abruptly

Recently, I delved into the world of JavaScript/TypeScript development in VS Code. Intrigued by Eclipse Theia, I decided to explore it further by setting up a backend service. To track its execution, I added a logpoint to my backend service to see when it ...

"Implementing Ionic 2 tabs allows for retrieving the previously selected option with the

Here is the code I am currently working on: onTabsChange(abc) { let selected_tab = this.tabs.getSelected(); let tab_index = selected_tab.index; console.log(tab_index); // should print current tab index but it prints previously selected tab index ...

Tips for navigating back to the previous component in React:

Greetings! I'm currently working on a simple CRUD example using React.Js and TypeScript. In my project, I have set up the following component hierarchy: -FetchNaselje --Modal ---AddNaselje It's structured such that AddNaselje is a child of Moda ...

Sharing Prisma type definitions across multiple microservices can help to maintain consistency

Currently, I am working on a project that involves multiple TypeScript microservices carrying out operations on the same database. Each microservice utilizes the Prisma client for database operations. The problem I am facing is the need to have duplicate ...

Mistake in maintaining hydration with styled-components and React Context

I encountered an issue where I have two theme variants in my app - dark and light. You can view the sandbox example here ThemeContext.ts export const ThemeContext = createContext<{ theme: AppThemeInterface, setTheme: Dispatch<SetStateAction< ...

How long does it take to delete and recreate a cloudfront distribution using AWS CDK?

I am currently undergoing the process of migrating from the AWS CDK CloudfrontWebDistribution construct to the Distribution Construct. According to the documentation, the CDK will delete and recreate the distribution. I am curious about the total duration ...

Error in AngularFire2 typings: The property 'take' is not present in the type 'FirebaseObjectObservable<any>'

Recently, I upgraded my ionic app from beta 11 to rc0, which also involved transitioning from typescript 1.8 to version 2. After following the configuration steps for AngularFire2 on the site Getting Started with Ionic 2 RC0, Firebase 3 + AngularFire 2, I ...

Error in Nestjs Swagger: UnhandledPromiseRejectionWarning - The property `prototype` cannot be destructed from an 'undefined' or 'null' object

Currently, I am in the process of developing a Nestjs REST API project and need to integrate swagger. For reference, I followed this repository: https://github.com/nestjs/nest/tree/master/sample/11-swagger However, during the setup, I encountered the foll ...

Is it possible to selectively disable the <span> tag in Angular?

I have encountered a situation where I need to dynamically disable a button and show a tooltip based on specific conditions in an Angular application. Here is the current code that I am using: <span *ngIf="(hourEnabled && theTest && ...

Error during Webpack Compilation: Module 'jQuery' not found in Travis CI with Mocha Test

I've been struggling to automate tests for my repository using mocha-webpack and Travis CI. The local machine runs the tests smoothly, but Travis CI hasn't been able to complete them yet due to an unresolved error: WEBPACK Failed to compile wit ...

Unable to register click event, encountering an error message stating, "co.console.log() is not a function."

I've been attempting to create a button that navigates to another page while passing an object in the parameters. However, I keep encountering an error message: "co. is not a function." It's perplexing because I receive the same error when tr ...

Fastify Schema Failing to Validate Incoming Requests

Currently, our backend setup involves using Node.js and the Fastify framework. We have implemented a schema in satisfy to validate user input. Below is the schema defined in schema.ts: export const profileSchema = { type: 'object', properti ...

Using Typescript to pass an optional parameter in a function

In my request function, I have the ability to accept a parameter for filtering, which is optional. An example of passing something to my function would be: myFunc({id: 123}) Within the function itself, I've implemented this constructor: const myFunc ...