tsc: not found at heroku when I upload the React+next js and node project

Question

I have react+next and node js project and I want to deploy that project at heroku. That is the structure of my project:- enter image description here

and my package.json file is enter image description here if I add "Start": "next start" only the frontend works and if I changed it "Start": "tsc -p server/tsconfig.json -watch && node server.js" it's gave me the error.

error is :-enter image description here

• Chris: Welcome to Stack Overflow. Please don't post screenshots of text. They can't be searched or copied, or even consumed by users of adaptive technologies like screen readers. Instead, paste the code as text directly into your question. If you select it and click the {} button or Ctrl+K the code block will be indented by four spaces, which will cause it to be rendered as code.

Answer 1

After Heroku installs the dependencies and devDependencies listed in package.json, all devDependencies get removed before the npm start command is run. So if you installed typescript under devDependencies and your project needs it at runtime, it won't be found. To stop it from being pruned, move typescript over to dependencies instead.

Another option would be to skip the pruning process altogether by setting the following config vars:

$ heroku config:set NPM_CONFIG_PRODUCTION=false YARN_PRODUCTION=false

Or set the NODE_ENV environment variable to anything other than production (Heroku's default).

• Mangita: I added same thing and that is my "start":"tsc -p server/tsconfig.json -watch && node server.js " command now its showing "Web process failed to bind to $PORT within 60" and in server.js I am using that code const PORT = process.env.PORT || '3008'; app.listen(PORT, () => { console.log(Our app is running on port ${ PORT }); })
• Mark G: @Mangita What happens if you manually include the host after PORT, e.g., app.listen(PORT, '0.0.0.0', () => { console.log( ... ?
• Mangita: same error when I tried this const port = process.env.PORT || '3008'; app.listen(port, '0.0.0.0', () => { console.log('Server is running s on port: ' + port) })
• Mark G: @Mangita I think we'll need a little more information about your project. Are there other parts of your stack that require connecting to a port (e.g., PostgreSQL) that could be causing that error? Are you building some type of browser-based TypeScript editor? I ask that because tsc in -watch mode is typically used only during development (i.e., only compiled JS is uploaded to or used in production). If not, then your start script should look like "start": "node server.js" because build already generated your JS.
• Mangita: my project is react+next and for backend, I am using node js for running backend code I am using these two commands at my local 1. tsc -p server/tsconfig.json -watch 2. node server.js. This command creates a convert the .ts file to .js files for production I added these two commands into one line like this "start": "tsc -p server/tsconfig.json && node server.js",