Issues with running NPM script for compiling TypeScript code

[UPDATE]

Initially, I resolved this issue by uninstalling tsc using npm uninstall tsc (as recommended in the response marked as the answer). However, the problem resurfaced after some time, and eventually, I found success by utilizing Windows Server for Linux (WSL) with VSCode. This solution worked instantly, so that's what I've been using.


My current dilemma involves running the tsc command through an NPM script:

"scripts": {
  "build": "tsc"
},

Executing tsc in the Windows command terminal works fine, but when I attempt to do it via the NPM script, it fails. Upon running tsc through the NPM script, I encounter the following error in the command console:

> npm run build

> <a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="1a6971737676376e687f7f5a2b342a342a">[email protected]</a> build
> tsc

'D\skill-tree\node_modules\.bin\' is not recognized as an internal or external command,
operable program or batch file.
node:internal/modules/cjs/loader:928
  throw err;
  ^

Error: Cannot find module 'D:\Documents\~College\~Coding\tsc\bin\tsc'
    at Function.Module._resolveFilename (node:internal/modules/cjs/loader:925:15)
    at Function.Module._load (node:internal/modules/cjs/loader:769:27)
    at Function.executeUserEntryPoint [as runMain] (node:internal/modules/run_main:76:12)
    at node:internal/main/run_main_module:17:47 {
  code: 'MODULE_NOT_FOUND',
  requireStack: []
}
npm ERR! code 1
npm ERR! path D:\Documents\~College\~Coding\D&D\skill-tree
npm ERR! command failed
npm ERR! command C:\Windows\system32\cmd.exe /d /s /c tsc

npm ERR! A complete log of this run can be found in:
npm ERR!     C:\Users\layto\AppData\Local\npm-cache\_logs\2021-06-03T13_19_01_935Z-debug.log

The error message indicates

Error: Cannot find module 'D:\Documents\~College\~Coding\tsc\bin\tsc'
, which I believe is the root cause of the issue since there is no such folder as ~Coding\tsc. But I'm unsure why the script is trying to access this folder or how to rectify it.

This is my tsconfig file:

{
  "compilerOptions": {
    "target": "ESNEXT",
    "module": "ESNext",
    "outDir": "./dist",
    "rootDir": "./src",
    "strict": true,
    "esModuleInterop": true,
    "skipLibCheck": true,
    "forceConsistentCasingInFileNames": true
  },
  "include": [
    "./src/**/*"
  ],
  "exclude": [
    "./node_modules",
    "./.vscode",
    "./templates"
  ]
}

And here's my package file:

{
  "name": "skill-tree",
  "version": "1.0.0",
  "description": "",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1",
    "build": "tsc"
  },
  "author": "Layton Burchell",
  "license": "ISC",
  "devDependencies": {
    "mongodb": "^3.6.9",
    "tsc": "^2.0.3",
    "typescript": "^4.3.2"
  }
}

Lastly, here's the log file:

 (log content)

Efforts I've made to resolve the issue include:

  • Global installation of typescript using npm i typescript -g
  • Reinstalling typescript locally with npm i typescript --save-dev
  • Attempting to use npx tsc instead of tsc in both the Windows console and NPM script (resulting in the same error as mentioned above).

Answer №1

There is no need for the tsc package that you listed under your devDependencies. This package does not come from Microsoft. The tsc command line tool is actually included in the typescript node package.

Therefore, it is recommended to uninstall the tsc package and try again.

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

Specific package-lock.json file for npm workspace environments

I have two separate packages within my npm workspace called api and cdk. I need to generate distinct package-lock.json files for both api and cdk, because each project will be deployed separately. Is it currently feasible to accomplish this using npm wor ...

Is there a way to modify the button exclusively within the div where it was pressed?

I plan to incorporate three buttons in my project (Download, Edit, and Upload). Upon clicking the Download button, a function is triggered, changing the button to Edit. Clicking the Edit button will then change it to Upload, and finally, clicking the Uplo ...

"Take control of FileUpload in PrimeNG by manually invoking it

Is there a way to customize the file upload process using a separate button instead of the component's default Upload button? If so, how can I achieve this in my code? Here is an example of what I've attempted: <button pButton type="button" ...

Are there any potential performance implications to passing an anonymous function as a prop?

Is it true that both anonymous functions and normal functions are recreated on every render? Since components are functions, is it necessary to recreate all functions every time they are called? And does using a normal function offer any performance improv ...

Enhancing React Native View and other component properties using styled-components

Utilizing styled-components for styling in my React Native app using Typescript has been effective. I recently crafted a StyledComponent to style a View component, but encountered an error when attempting to extend the ViewProps: The type '{ children: ...

Steps to converting an enum or literal

Hey there, I'm relatively new to working with TypeScript and I've been experimenting with transforming enums/literals using functions. For instance, creating a capitalize function that capitalizes the first letter of a string. (e.g., mapping typ ...

Encountered an issue when attempting to launch a Nest.js application on an EC2 instance

Run Command: npm run start:dev > <a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="3c4f594e4a594e7c0c120c120d">[email protected]</a> start:dev > cross-env NODE_ENV=development nest start --watch node:events:48 ...

Data from graphql is not being received in Next.js

I decided to replicate reddit using Next.js and incorporating stepzen for graphql integration. I have successfully directed it to a specific page based on the slug, but unfortunately, I am facing an issue with retrieving the post information. import { use ...

Is it possible to duplicate a response before making changes to its contents?

Imagine we are developing a response interceptor for an Angular 4 application using the HttpClient: export class MyInterceptor implements HttpInterceptor { public intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<an ...

The output is displayed on the console, but it cannot be stored in a variable

var x = ""; Promise.all(listOfItems).then(function(results) { for (let j in results) { var newitem = results[j]; x = newitem; console.log(`x: ${x}`); } }); The output on the console displays x: "val ...

Tips for obtaining the width of a child element during a resize event in an Angular application

When resizing the window, I am attempting to determine the width of a specific sub-component. If I want to retrieve the entire app's width, I can use the following code: @HostListener('window:resize', ['$event']) onResize( ...

npm command is not able to successfully update the JSON file

My attempt to create a custom NPM build command in my package.json file isn't going as planned. The command I'm trying to run before the actual build is this one: json -I -f ./src/environments/build.json -e 'this.patch++' Before incor ...

Error message: Unable to retrieve `__WEBPACK_DEFAULT_EXPORT__` before initializing Firebase Admin in a nx and nextjs application

My current project involves a Typescript Nx + Next.js App integrated with Firebase (including Firebase Admin). In this codebase, I have defined a firebase admin util as shown below - // File ./utils/FirebaseAdmin.ts // import checkConfig from './check ...

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 ...

What sets npm run-script apart from npm run?

I keep coming across mentions of both npm run <task> and npm run-script <task>. Can someone explain the distinction between the two? I've read numerous discussions about the variance in commands like npm build versus npm run build, but no ...

Should one bother utilizing Promise.all within the context of a TypeORM transaction?

Using TypeORM to perform two operations in a single transaction with no specified order. Will utilizing Promise.all result in faster processing, or do the commands wait internally regardless? Is there any discernible difference in efficiency between the t ...

`How can I eliminate all duplicate entries from an array of objects in Angular?`

arr = new Array(); arr.push({place:"1",name:"true"}); arr.push({place:"1",name:"false"}); arr.push({place:"2",name:"false"}); arr.push({place:"2",name:"false"}); arr.push({place:"3",name:"false"}); arr.push({place:"3",name:"true"}); I'm curious about ...

Attention: Take note of this NPM notice when installing a new npm package

Every time I try to install an npm package, I keep getting the same notice that is displayed below. I've attempted to reinstall node.js, but I'm still not sure what I'm doing wrong. "npm notice Beginning October 4, 2021, all connection ...

emailProtected pre-publish: Running `python build.py && webpack` command

i am currently using scratch-blocks through the Linux terminal I have encountered a problem which involves running the following command: python build.py && webpack [email protected] prepublish: python build.py && webpack Can anyon ...

Library for Nodejs that specializes in generating and converting PDF/A files

Is there a library available that can convert/create a PDF/A file? I've been searching for solutions but the existing answers suggest using an external service or provide no response at all. I heard about libraries in other languages like ghostscriptP ...