CODEWITHSUNDEEP
expressvue.js
Influento
Influento

Reputation: 99

express js blank root page

I have simple vue js app with next express js config file

var express = require('express');
var http = require('http');

var app = express();
var server = http.createServer(app);
app.use(express.static('.'));
server.listen(1111);

Result of build is located in /dist folder. However my express js file is located in /

After I run it I see blank page on localhost:1111 and actually it retrieves index.html from / but, I see my app on localhost:1111/dist and it retrieves index.html from /dist

My purpose is to receive index.html from /dist when I visit localhost:1111.

I've tried to change express config to app.use(express.static('./dist')) and similar to this. But it only breaks anything (i'm not able to reach my app on localhost:1111/dist and localhost:1111/)

In general I have next project structure

/ -> express js config is here and basic index.html is here

/dist -> build result is located here (index.html + static files)

/dist/static -> static files are here

/build -> webpack config is here

Upvotes: 0

Views: 541

Answers (2)

Gokulakannan T
Gokulakannan T

Reputation: 614

Sometimes this issue may come because of, the app doesn't server from the root folder. For example, /home/user/path-to-the-project" The app need to serve like this.

So here you need to change like below,

app.use(express.static(__dirname + '/dist'));

For more information, you check express doc. See here

Upvotes: 0

Influento
Influento

Reputation: 99

The problem why app.use(express.static('dist')); didn't work was that in index.html I had link to other files like /dist/static/.. what is not correct if my root folder is dist. So, despite moderator set that webpack doesn't related to this the solution was to change webpack config for production to make build script generate links to file in /dist/index.html like /static/.. instead of /dist/static/..

And obviously I had to change

app.use(express.static('.'));

to

app.use(express.static('dist'));

As a conclusion - it make sense to check generated index.html and analyze if the paths there are correct.

Upvotes: 0

Related Questions