4

I'm seeing some really odd behavior where some of my files are correctly being returned by my express/node server (using express.static()), but not files within subdirectories. The frustrating thing is that it works fine using node or foreman locally, it just won't work on heroku. This gist has the main files at play here, and my app structure looks like this:

-app
    - index.html
    - img/
        - base.png
        - sub/
            - sub.png
    - scripts
        - base.js
        - sub/
            - sub.js
    - css
        - base.css
        - sub/
            - sub.css
- server
    - app.js

The index.html, and base.* files all load fine, it's just the sub.* files that 404. Seems bizarre that express.static would go 1 level deep, but not 2

I've tried a slew of different configurations, including this stackoverflow answer. I have to be missing something simple. Thanks for the help.

UPDATE:

When I console.log the following on server startup on heroku, I get:

  • path.join(__dirname, '../app') = /app
  • path.join(__dirname, '/../app') = /app/app
  • path.normalize(path.join(__dirname, '../app')) = /app/app
  • path.join(process.cwd(), '../app') = /app/app

4 Answers 4

3

Make sure that the sub directories of your directory are added to your Git repository.

You can use heroku run 'ls ~' to help debug the issue (by observing the files on the dyno).

Putting the absolute path did not fix it for me. Your .gitignore may be excluding it.

2

Try changing your static dir to :

app.use(express.static(path.join(__dirname, '/../app'), { maxAge: 86400000 }));

or

app.use(express.static(path.normalize(path.join(__dirname, '../app')), { maxAge: 86400000 }));
1
  • Normalizing paths worked for me too!
    – jloh
    Jan 5, 2023 at 3:20
1

add {{__dirname}}

<link href="{{__dirname}}/stylesheets/style.css" type="text/css" rel="stylesheet" media="screen,projection"/>

in your layout.hbs or layout.jde

0

I've just had the same issue, and I've read all the different answers, some of which may have been important, but, in the end, this is the change I made after which the static content started getting served.

CALENDARSPATH = path.join(process.env.PWD, 'calendars');

...

-app.use(express.static(CALENDARSPATH, { maxAge: 86400000 }));
+app.use('/calendars', express.static(CALENDARSPATH, { maxAge: 86400000 }));

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.