A guide on declaring global variables with TypeScript validation in a JavaScript file

Currently, I am utilizing TypeScript for type checking of JS files. This involves adding a // @ts-check comment at the beginning of the file. However, I am encountering an issue with a global variable that has been assigned separately using window.

// index.js

window.MY_GLOBAL_VARIABLE = 42;

// module.js

console.log(MY_GLOBAL_VARIABLE); // Error: Cannot find name 'MY_GLOBAL_VARIABLE'.

I have attempted to alleviate this error by including the following comments:

/*
declare var MY_GLOBAL_VARIABLE: number
*/

as well as

/*
declare global {
  var MY_GLOBAL_VARIABLE: number
}
*/

Furthermore, I have also tried adding these declarations to a global.d.ts file. Despite my efforts, the checker continues to flag the error.

If anyone knows a solution to rectify this issue, please share your insights.

javascripttypescript

Answer №1

If you want to keep all your declarations organized, consider storing them in a single file like index.d.ts. This way, the TypeScript compiler will be able to locate it and include it in its analysis of your JavaScript code.

Demonstration

index.d.ts

declare const MY_GLOBAL_VARIABLE: number;

module.js

console.log(MY_GLOBAL_VARIABLE);

I've also created a guide demonstrating how you can enhance an existing module by using the declare module feature in your index.d.ts file.

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

Is there a way to set up one function that can be used across different HTML buttons?

As a newcomer to JS, I've taken on the challenge of creating a size comparison tool for practice. In my HTML file, I have multiple buttons representing different US sizes that should display the corresponding UK, EU, and CM size when clicked inside a ...

javascriptarraysdombutton

Is there any available tool that can autoformat TypeScript in Sublime Text?

I've been utilizing SublimeText for my TypeScript projects, and up until now, I've relied on JsFormat for automatic formatting. Unfortunately, JsFormat doesn't support TypeScript. Are there any alternative tools I can use for auto formatting ...

typescriptsublimetext3

Creating a JSON object from text using JavaScript is a straightforward process

Looking to generate an object using the provided variable string. var text ='{"Origin":"Hybris","country":"Germany","Email":"<a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfem ...

javascript

Combining the date from one source and the time from another source to create a unified date in Typescript

In my TypeScript code, I'm working with four fields of type Date: StartDate StartTime EndDate EndTime My goal is to combine StartDate and StartTime into a single field called Start, as well as EndDate and EndTime into a field called End. Desp ...

angulartypescript

What is the best way to distinguish a particular item in a <select> element and include a delete button for each row using jQuery?

1.) I've set up a nested table and now I want to ensure that when the 'Delete' button within the child table is clicked, its corresponding row gets deleted. 2.) I have a <select> tag. The issue is how can I implement validation to che ...

javascriptjqueryhtml

Updating the content of a Telerik RadEditor using Javascript/jQuery

I am currently facing a challenge in manually cleaning the HTML of a Telerik RadEditor using Javascript. Despite my efforts, I am struggling to find the appropriate location to store the value in order for it to be saved during post back. Below is the Jav ...

asp.netjavascriptjquerytelerikradeditor

What is the most efficient way to extract the largest number from a textarea?

Here's the scenario: I have a textarea with text enclosed in square brackets like so: <textarea> this is a test [1] also this [2] is a test and again [3] this is a test </textarea> The task at hand is to extract the largest number found ...

javascriptjqueryregex

Display the console.log output directly on the document instead of the console

My HTML file is super simple and only includes this code: <html> <head> <script defer src="./bundle_ACTUAL.js"></script> </head> </html> After running ./bundle_ACTUAL.js, I see the output in th ...

javascripthtmlgoogle-chromeconsole

Exploring Safari's Date Object

Currently using safari 8.0, I attempted to execute new Date('sat-oct-10-2015'); Interestingly, in chrome it correctly outputs a Date object with the given date. However, in safari the result is Invalid Date I'm now faced with the chall ...

javascript

Focusing on the active element in Typescript

I am working on a section marked with the class 'concert-landing-synopsis' and I need to add a class to a different element when this section comes into focus during scrolling. Despite exploring various solutions, the focused variable always seem ...

javascripttypescript

What is the best way to identify identical companies, consolidate them into a single entity, and combine their weights for a more

I've been experimenting with various methods such as filter, reduce, and includes, but I'm struggling to grasp the concept of how to solve this. Here is an array of objects that I have: [ { name: 'GrapeCo', weight: 0.15 }, { name: ...

javascriptnode.js

Automated pagination integrated with automatic refreshing of div every few seconds

I am currently working on setting up a datatable and I need it to be displayed on the monitor in such a way that it can refresh the div and automatically paginate to the next page. However, whenever the div is refreshed, the auto-pagination gets cancelle ...

javascriptdatatablescodeigniter-3

What specific types of errors is this try-catch block designed to catch and manage?

// This function establishes a connection to MongoDB using Mongoose const connectToDatabase = (url) => { return mongoose.connect(url, { useNewUrlParser: true, useUnifiedTopology: true }) .then(() => console.log('Conn ...

javascriptnode.jsexpress

Tips for monitoring changes to files while developing a NestJs application within a Docker container

Having an issue with NestJS and Docker here. Trying to run the development script using npm start: dev, but encountering a problem where the app runs fine but doesn't detect any changes in the source files, hindering the development process. Here&apo ...

typescriptdockerdocker-composenestjs

Setting up Socket.io results in numerous transport polling GET requests being initiated

I have set up an express.js server-side and followed the socket.io guide. However, I am facing issues with the socket connection not being successful, and there seems to be a high number of unexpected GET requests like this: https://i.stack.imgur.com/GDGg ...

javascriptnode.jssocketsexpresssocket.io

How to Save the Entire HTML Page into a jQuery Variable

I need assistance with manipulating HTML Email templates in my app using a script. The challenge I'm facing is dynamically parsing through the HTML of an email template that is stored as a value from a <textarea> (specifically CodeMirror). The ...

javascriptjqueryhtmlcodemirror

Secondary Electron window not properly receiving IPC messages

While developing my TypeScript code that is linked to the HTML being executed by my application, I encountered an issue with creating a new window for my settings. It seems that the preloaded script is loaded onto the new window upon opening, but the windo ...

javascripttypescriptelectron

Unable to establish connection with nodejs server from external devices

Currently, I am leveraging a React client along with a Node.js server (MERN Stack). The server operates smoothly on my computer; however, I encounter difficulties when attempting to connect from my mobile phone to the IPv4 of my PC using the correct port ...

javascriptnode.jsreactjsexpressserver

Issue with deploying Azure node.js application due to libxmljs error

My goal is to launch my website using libsmljs built on node.js on Windows Azure. However, during the deployment process on Azure, I encounter a failure with the following error message: Command: C:\DWASFiles\Sites\CircuitsExpress\Virt ...

javascriptnode.jsazure

The time format you have specified is not supported

Attempting to use the most basic moment test, but encountering issues. The following steps were taken: npm install moment In app.js file, I included the following: var moment = require('moment'); var testDate = new Date(); console.log(moment( ...

javascriptnode.jsmomentjs