0

Trying to deploy an Angular app to Heroku using Github, following the instructions on here: https://itnext.io/how-to-deploy-angular-application-to-heroku-1d56e09c5147

Deployment is successful, but when I open the app, I get a 'Not Found' error on the screen. Tried changing the location in 'app.use' and 'res.sendFile' a thousand times, but with no luck, for now this is my 'server.js' code:

These are my app.use and res.sendFile functions: 

app.use(express.static(__dirname + '/dist/app_name'));
res.sendFile(path.join(__dirname + '/dist/app_name/index.html'));

Folder structure:

├── angular.json
├── browserslist
├── e2e
├── karma.conf.js
├── node_modules
├── package.json
├── package-lock.json
├── README.md
├── server.js
├── src
    ├── app
│   ├── assets
│   ├── environments
│   ├── favicon.ico
│   ├── index.html
│   ├── main.ts
│   ├── polyfills.ts
│   ├── styles.css
│   └── test.ts
├── tsconfig.app.json
├── tsconfig.json
├── tsconfig.spec.json
└── tslint.json

My guess would be that my deployment can't locate my index.html in the src folder, but I haven't got any more ideas what path to provide..

Tried removing the '_dirname' in both functions, but still the same problem.

Would highly appreciate all the suggestions.

marco_van_cerbex
  • 53
  • 7
  • Does this answer your question? [Deploying Angular app to Heroku, build was successful but in browser it shows 404 not found](https://stackoverflow.com/questions/50297950/deploying-angular-app-to-heroku-build-was-successful-but-in-browser-it-shows-40) – Gabriel Arghire May 26 '22 at 09:54
  • Check answer here: https://stackoverflow.com/a/72389883/11322237 – Gabriel Arghire May 26 '22 at 09:54

1 Answers1

0

replace this:

app.use(express.static(__dirname + '/dist/app_name'));
res.sendFile(path.join(__dirname + '/dist/app_name/index.html'));

with:

app.use(express.static(path.join(__dirname, 'dist','app_name'));
res.sendFile(path.join(__dirname,'dist','app_name','index.html'));
igor_c
  • 1,200
  • 1
  • 8
  • 20
Oozil
  • 11