It appears that Typescript is having trouble locating the tsconfig.json file

I'm diving into the world of TypeScript and I am facing an issue with configuring it to compile the latest version of JavaScript. Despite my efforts, it doesn't seem to work.

Here is my tsconfig.json file:

{
  "compilerOptions": {
    "target": "esnext"
  }
}

This is the structure of my directory:

https://i.sstatic.net/8aKrE.png

I am unsure why this problem is occurring, any help or guidance would be greatly appreciated.

The content of script.ts file:

async function hello() {
  return "World";
}

The resulting JavaScript file looks like this:

var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
    // JavaScript function code here
};
function hello() {
    return __awaiter(this, void 0, void 0, function () {
        // More JavaScript code here
    });
}
typescripttsconfig

Answer №1

After reaching out about the problem on the TypeScript GitHub repository, I was provided with helpful solutions. Here is where you can find the reported issue and its resolution.

If you prefer not to visit the link, the fix involves running tsc without specifying a filename after it. And just to clarify, credit should be given to those who contributed on the GitHub issue if possible.

I want to express my gratitude to Arakiss for introducing me to the tsc --init command and suggesting additional configurations in the tsconfig.json file.

Answer №2

Restarting your VSC editor can work wonders. I've found it to be a solution in many instances.

Answer №3

If you're new to using the tsc compiler, I suggest starting with a default config and exploring as you go. Begin by installing the compiler globally:

npm install -g typescript

Once the compiler is installed, generate the default config with this command:

tsc --init

You'll see a configuration similar to this:

{
  "compilerOptions": {
    /* Various options here */

    } 
}

Feel free to customize the config based on your needs.

The specific config for targeting ESNext JavaScript in a NodeJS Express project should look like this:

{
  "compilerOptions": {
    "target": "ESNext",
    "module": "ESNext",
    "moduleResolution": "node"
  }
}

This setup allows you to work with the latest ESNext features for your project.

-UPDATE-

In response to your edited post, the behavior you described is expected. If you encounter issues when using tsc on a single file, it may be related to how the tsconfig.json file is being accessed.

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

Discovering an array containing a specific value and transforming it to another array in Angular 8

I have an array called this.data which contains a list of platforms. Each platform has its own set of section lists, where a section list consists of values like sectionName, sectionid, and sectionVal. Now, my goal is to replace the old sectionList with a ...

angulartypescriptangular8

Is there a way to eliminate the line that appears during TypeScript compilation of a RequireJS module which reads: Object.defineProperty(exports, "__esModule", { value: true });?

Here is the structure of my tsconfig.json file: { "compileOnSave": true, "compilerOptions": { "module": "amd", "noImplicitAny": false, "removeComments": false, "preserveConstEnums": true, "strictNullChecks": ...

javascripttypescriptrequirejsamdtsc

Deciphering the outcomes of Promise versus Observables

Query: Methodology fetchDataQuery(): any { let query = new Query((resolve, reject) => { resolve([ { name: 'Apple', type: 'fruit' }, { name: 'Banana', type: 'fruit' } ]); }); ...

angulartypescriptpromiserxjsobservable

Leveraging the left-hand side operator while invoking functions within Angular 2 templates

I've encountered a puzzling situation with the function in my component : public limit: number = 3 public logLimit(limit) { console.log(limit) } and in my template : <div (click)="logLimit(--limit)">Decrease and log limit</div> Stra ...

angulartypescript

Leveraging the Power of JavaScript within Angular 12

Currently, I am in the process of learning how to utilize Angular 12 and am attempting to create a sidenav. While I am aware that I can use angular material for this task, I would prefer not to incorporate the associated CSS. My goal is to integrate this ...

javascriptangulartypescript

What causes a union with a conditionally assigned property to lead to more relaxed types than anticipated?

Take a look at this TypeScript code snippet: const test = Math.random() < 0.5 ? { a: 1, b: 2 } : {}; Based on the code above, I would assume the type of object 'test' to be: const test: { a: number; b: number; } | {} This is the most str ...

typescript

Discover the solution to the issue of bookmarking a card on a page using react, typescript, and mui!

Whenever I try to favorite a card by clicking on its icon, all cards of the same type get bookmarked instead of just the one I clicked on. This is causing an issue where multiple cards are being favorited per page when I only want to bookmark individual on ...

reactjsjsontypescriptmaterial-uifrontend

oidc-client-js failing to display all profile claims that are supported by oidc-client-js

When setting up UserManager on the oidc-client-ts TypeScript module using the config object below: var config = { authority: "https://localhost:3000", client_id: "js", redirect_uri: "https://localhost:3001/callback.ht ...

javascripttypescriptoauthopenid

Misplacing this pointer within the $scope.$on event

After registering the "$routeChangeSuccessEvent" from AngularJS and setting the callback function, I encountered an issue where I couldn't access my controller's instance using "this". It appears that the current this instance is undefined. The ...

javascriptangularjstypescript

Typescript throwing error TS2307 when attempting to deploy a NodeJS app on Heroku platform

Encountering an error when running the command git push heroku master? The build step flags an error, even though locally, using identical NodeJS and NPM versions, no such issue arises. All automated tests pass successfully without any errors. How can this ...

node.jstypescriptheroku

Steps to automatically make jest mocked functions throw an error:

When using jest-mock-extended to create a mock like this: export interface SomeClient { someFunction(): number; someOtherFunction(): number; } const mockClient = mock<SomeClient>(); mockClient.someFunction.mockImplementation(() => 1); The d ...

javascripttypescriptjestjsmocking

How can we optimize component loading in react-virtualized using asynchronous methods?

In my component, I have implemented a react-virtualized masonry grid like this: const MasonrySubmissionRender = (media: InputProps) => { function cellRenderer({ index, key, parent, style }: MasonryCellProps) { //const size = (media.submiss ...

reactjstypescriptreact-virtualized

Defining the type of the createAction() function in TypeScript within the context of Redux Toolkit

Lately, I have been delving into the redux-toolkit library but I am struggling with understanding the type declaration of the createAction function as demonstrated below. The createAction function returns a PayloadActionCreator which includes a generic of ...

typescriptgenericsreduxredux-toolkit

A similar functionality to the async pipe in TypeScript

In my Ionic2 project, I'm utilizing ng-translate from ng2-translate to translate strings in the code. Currently, I am using the service in the following way: translate.get('ERROR').subscribe((res: string) => { //The translated string ...

javascriptangulartypescriptionic2rxjs

What is the best way to retrieve an array of references from MongoDB?

I have a JSON snippet stored in MongoDB that looks like this: { createdAt: 1641840199, name: 'hello' projects: [ new ObjectId("61dc99b2fdfbd72f33d4d699") ] } In the projects array, I have a reference to documents with project. Now, my ques ...

javascriptjsontypescriptmongodb

classes_1.Individual is not a callable

I am facing some difficulties with imports and exports in my self-made TypeScript project. Within the "classes" folder, I have individual files for each class that export them. To simplify usage in code, I created an "index.ts" file that imports all class ...

javascriptnode.jstypescript

Error TS2322: The type 'Count' cannot be assigned to type 'ReactNode'

Hey everyone, I'm new to React and TypeScript and could really use some help. I'm currently trying to figure out how to use useState with TypeScript. import React,{useState} from 'react' interface Count{ count: number } const App = ( ...

javascriptreactjstypescript

Creating non-changing identifiers with ever-changing values in Angular by leveraging TypeScript?

I need to transform all the labels in my application into label constants. Some parts of the HTML contain dynamic content, such as This label has '1' dynamic values, where the '1' can vary based on the component or a different applicat ...

angulartypescript

Angular version 5 and above introduces a new feature called "openFromComponent" within the Snackbar component, facilitating seamless communication

Angular (v5.2.10) Snackbar --| Introduction |-- I am facing a scenario where an Angular component named "Parent" is initializing an Angular Material Snackbar known as snackBar. The snackbar is being passed in the component called SnackbarMessage, which ...

angulartypescriptangular-componentssnackbar

Tips for Optimizing Typescript Queries to SQL Server

In my C# application, I have the following function: foreach (var p in proglist) { programData.GetData1= new List<GetData1_ViewModel>(GetData1(programid, reportingdate)); programData.GetData2= new List<GetData2_ViewModel>(GetData2(programid ...

javascripttypescript