How to resolve module not found on Heroku?

Question

I am using module-alias within my nodejs application. Locally everything works fine, the file path and modules are being found.

However, when deploying on Heroku none of my aliases are being recognized and this error occurs

Error: Cannot find module 'app/models/socket.js' app[web.1]: at Function.Module._resolveFilename (module.js:536:15) app[web.1]: at Function.Module._load (module.js:466:25) app[web.1]: at Module.require (module.js:579:17) app[web.1]: at require (internal/module.js:11:18) app[web.1]: at Object.<anonymous> (/app/bin/www:17:21) app[web.1]: at Module._compile (module.js:635:30) app[web.1]: at Object.Module._extensions..js (module.js:646:10) app[web.1]: at Module.load (module.js:554:32) app[web.1]: at tryModuleLoad (module.js:497:12) app[web.1]: at Function.Module._load (module.js:489:3) app[web.1]: npm ERR! code ELIFECYCLE app[web.1]: npm ERR! errno 1

package.json

{
  "name": "nameless",
  "version": "1.0.0",
  "private": true,
  "scripts": {
    "start": "node ./bin/www",
    "commit": "commit-wizard"
  },
  "engines": {
    "node": "8.9.1"
  },
  "dependencies": {
    "apn": "^2.2.0",
    "apn-test": "^1.3.1",
    "app-module-path": "^2.2.0",
    "async": "^0.9.0",
    "await-timeout": "^0.3.0",
    "aws-subdomain": "^0.1.2",
    "base64-img": "^1.0.3",
    "bcrypt": "^0.8.7",
    "bluebird": "^2.10.2",
    "body-parser": "~1.8.1",
    "change-case": "^2.1.6",
    "circle-to-polygon": "^1.0.0",
    "cookie-parser": "~1.3.3",
    "cors": "^2.8.4",
    "cron": "^1.3.0",
    "debug": "^4.1.0",
    "diet": "^0.16.0",
    "ejs": "^2.5.7",
    "express": "~4.9.0",
    "express-async-handler": "^1.1.4",
    "express-fileupload": "^0.3.0",
    "express-fileuploader-s3": "0.0.1",
    "express-sslify": "^1.2.0",
    "express-subdomain": "^1.0.2",
    "fb": "^1.1.1",
    "fcm-node": "^1.2.1",
    "fcm-push": "^1.1.3",
    "geocoder": "^0.2.3",
    "geojson-area": "^0.2.1",
    "geojson-polygon-center": "0.0.0",
    "geojson-rewind": "^0.2.0",
    "google-libphonenumber": "^3.0.12",
    "google-locations": "^0.1.2",
    "googleplaces": "^0.6.0",
    "graceful-fs": "^4.1.15",
    "gulp": "^3.8.10",
    "gulp-concat": "^2.6.0",
    "gulp-ng-annotate": "^1.0.0",
    "gulp-nodemon": "^1.0.5",
    "gulp-replace-task": "^0.2.1",
    "gulp-run": "^1.6.6",
    "gulp-sloc": "^1.0.4",
    "gulp-sourcemaps": "^1.12.1",
    "gulp-stylus": "^2.7.0",
    "gulp-uglify": "^1.2.0",
    "http": "0.0.0",
    "http-request": "^0.7.0",
    "instagram-api": "^1.0.3",
    "instagram-node": "git+https://github.com/andrewoodleyjr/instagram-node.git",
    "instagram-node-api": "^1.6.0",
    "instagram-node-lib": "^0.1.1",
    "jade": "~1.6.0",
    "json2csv": "^2.12.0",
    "jwt-simple": "^0.2.0",
    "knox": "^0.9.2",
    "linkedin-scraper2": "https://github.com/andrewoodleyjr/node-linkedin-scraper2/tarball/master",
    "mobile-detect": "^1.4.1",
    "module-alias": "^2.1.0",
    "mongoose": "^5.0.4",
    "mongoose-query-random": "^1.0.1",
    "mongoose-random": "^0.1.1",
    "mongoose-simple-random": "^0.4.1",
    "morgan": "~1.3.0",
    "multer": "^0.1.6",
    "ng-intl-tel-input": "^2.0.0",
    "node-cron": "^1.2.1",
    "node-foursquare": "^0.3.2",
    "node-foursquare-venues": "^1.1.0",
    "node-instagram": "^2.0.2",
    "node-linkedin": "git+https://github.com/andrewoodleyjr/node-linkedin.git",
    "nodemailer": "^1.3.0",
    "nodemailer-ses-transport": "^1.5.1",
    "nodemon": "^1.14.12",
    "opbeat": "^4.17.0",
    "polygon-centroid": "^1.0.0",
    "prerender-node": "^2.7.4",
    "q": "^1.5.1",
    "quickthumb": "0.0.11",
    "raw-body": "^2.3.2",
    "request": "^2.83.0",
    "sendy-api": "git://github.com/igord/sendy-api.git",
    "serve-favicon": "^2.4.5",
    "socket.io": "1.7.2",
    "stripe": "^6.3.0",
    "swagger": "0.0.1",
    "swagger-node-express": "^2.1.3",
    "swagger-tools": "^0.9.0",
    "tempie": "0.0.2",
    "timezone-compute": "^0.2.2",
    "timezoner": "^0.1.9",
    "twilio": "^3.11.3",
    "validator": "^3.27.0",
    "vhost": "^3.0.2",
    "webpack": "^4.26.0",
    "webpack-node-externals": "^1.7.2"
  },
  "devDependencies": {
    "eslint": "^5.9.0",
    "eslint-config-airbnb": "^17.1.0",
    "eslint-config-airbnb-base": "^13.1.0",
    "eslint-import-resolver-alias": "^1.1.1",
    "eslint-plugin-import": "^2.14.0",
    "eslint-plugin-jsx-a11y": "^6.1.2",
    "eslint-plugin-react": "^7.11.1",
    "prettyjson": "^1.2.1"
  },
  "_moduleAliases": {
    "@root": "./",
    "@db": "db/",
    "@models": "models/",
    "@util": "util/",
    "db": "db/db.js",
    "config.js": "config.js"
  }
}

bin/www

require('module-alias/register');

const SocketModel = require('@models/socket.js');
const app = require('@root/app.js');

Answer 1

Note, this is just for last resort if no solution works yet.

Since the OP says that it builds and works in the local.

Just let typescript ignore those particular imports. Add //@ts-ignore for every imports with aliases. I know this is an ugly solution but nothing works so far. Note that module-alias is still required for this workaround.

Since you said that it works locally then i believe just letting typescript ignore those files during build isn't that much of a big deal since all we care about is the files are compiled to javascript. Of course, you need to test the compiled js files just to be sure.

The problem is related with typescript not resolving path mappings to their corresponding paths during build.

You can find more information here. Check also the comments on that answer if you want to manually convert those path mappings on the compiled files.

Another relevant issue.

Answer 2

You need to remove the slashes at the end of the paths under "_moduleAliases" like so:

"_moduleAliases": {
 "@root": ".",
 "@db": "db",
 "@models": "models",
 "@util": "util",
 "db": "db/db.js",
 "config.js": "config.js"
}