heroku sh: 1: tsc: not found - node.js

Question

this my scripts
{
"name": "fullstack-apollo-express-boilerplate-project",
"version": "1.0.0",
"description": "",
"main": "index.ts",
"scripts": {
"tsc": "./node_modules/typescript/bin/tsc",
"build": "rimraf ./build && tsc",
"dev": "nodemon",
"start": "npm run build && node build/index.js",
"codegen": "graphql-codegen --config ./codegen.yml",
"lint": "eslint . --ext .ts",
"lint-and-fix": "eslint . --ext .ts --fix",
"prettier-format": "prettier --config .prettierrc src/**/*.ts --write"
},
"keywords": [],
"author": "",
"license": "ISC",
"devDependencies": {
"#graphql-codegen/cli": "^2.3.0",
"#graphql-codegen/typescript": "^2.4.1",
"#graphql-codegen/typescript-resolvers": "^2.4.2",
"#shopify/eslint-plugin": "^41.0.1",
"#types/bcryptjs": "^2.4.2",
"#types/cookie-parser": "^1.4.2",
"#types/mongoose-lean-virtuals": "^0.5.2",
"#types/nodemailer": "^6.4.4",
"#types/uuid": "^8.3.3",
"#typescript-eslint/eslint-plugin": "^5.5.0",
"#typescript-eslint/parser": "^5.5.0",
"eslint": "^8.4.0",
"eslint-config-prettier": "^8.3.0",
"eslint-plugin-import": "^2.25.3",
"eslint-plugin-prettier": "^4.0.0",
"nodemon": "^2.0.15",
"prettier": "^2.5.1",
"ts-node": "^10.4.0",
"typescript": "^4.5.2"
},
"dependencies": {
"#types/express": "^4.17.13",
"#types/node": "^16.11.11",
"apollo-server-core": "^3.5.0",
"apollo-server-express": "^3.5.0",
"bcryptjs": "^2.4.3",
"cookie-parser": "^1.4.6",
"cors": "^2.8.5",
"crypto-random-string": "3.3.1",
"dotenv": "^10.0.0",
"express": "^4.17.1",
"express-openid-connect": "^2.5.1",
"graphql": "^16.0.1",
"graphql-fields-list": "^2.2.4",
"graphql-parse-resolve-info": "^4.12.0",
"graphql-voyager": "^1.0.0-rc.31",
"i": "^0.3.7",
"jsonwebtoken": "^8.5.1",
"moment": "^2.29.1",
"mongoose": "^6.0.14",
"mongoose-lean-virtuals": "^0.9.0",
"nodemailer": "^6.7.2",
"rimraf": "^3.0.2"
}
}
when i do deploy i get error
2022-01-14T08:20:20.950719+00:00 app[web.1]: sh: 1: tsc: not found
2022-01-14T08:20:20.956238+00:00 app[web.1]: npm ERR! code ELIFECYCLE
2022-01-14T08:20:20.956684+00:00 app[web.1]: npm ERR! syscall spawn
2022-01-14T08:20:20.956866+00:00 app[web.1]: npm ERR! file sh
2022-01-14T08:20:20.956950+00:00 app[web.1]: npm ERR! errno ENOENT
2022-01-14T08:20:20.961092+00:00 app[web.1]: npm ERR! fullstack-apollo-express-boilerplate-project#1.0.0 build: `rimraf ./build && tsc`
2022-01-14T08:20:20.961191+00:00 app[web.1]: npm ERR! spawn ENOENT
2022-01-14T08:20:20.961291+00:00 app[web.1]: npm ERR!
2022-01-14T08:20:20.961337+00:00 app[web.1]: npm ERR! Failed at the fullstack-apollo-express-boilerplate-project#1.0.0 build script.
2022-01-14T08:20:20.961377+00:00 app[web.1]: npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
2022-01-14T08:20:20.961191+00:00 app[web.1]: npm ERR! spawn ENOENT
2022-01-14T08:20:20.961291+00:00 app[web.1]: npm ERR!
2022-01-14T08:20:20.961337+00:00 app[web.1]: npm ERR! Failed at the fullstack-apollo-express-boilerplate-project#1.0.0 build script.
2022-01-14T08:20:20.961377+00:00 app[web.1]: npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
I can't figure out what's the reason Everything works fine for me.

Answer 1

If you don't have a Procfile, Heroku will run your start script as a web process.
Your start script runs your build script, and your build script compiles your app using tsc:
"build": "rimraf ./build && tsc",
"start": "npm run build && node build/index.js",
// ^^^^^^^^^^^^^
This causes Heroku to try to compile your app every time your dyno starts, and since typescript is (correctly) a devDependency, tsc isn't available at runtime.
It doesn't make much sense to have your start script call your build script: your app only needs to be compiled once.
Modify your start script so it doesn't call your build script:
"build": "rimraf ./build && tsc",
"start": "node build/index.js",
Heroku automatically runs your build script at deploy time, and now it won't try to re-compile it at runtime.