The html under the express rendering dist folder directly displays the source code?

I use the dist folder generated by vue, and a server created by myself is OK

var express = require("express");

var app = express();

app.use(express.static("./dist"));

module.exports = app.listen("90", (err) => {
  if (err) {
    console.log(err);
    return;
  }
  console.log("Listening at http://localhost:90\n");
});

the browser can see the effect, but I have problems when I want to deploy it to the express project. Online tutorials mainly copy the contents of the dist folder to the public folder that has been used as a static resource folder
clipboard.png


expresshtml
clipboard.png

.

has also tried some ways to switch between template engines ( Node.JS Express rendering HTML to show source code problems and solve ), but it has no effect. How to solve this?

Apr.19,2022

I also encountered this question, and after reading your answers, I tried it.
here I leave the newcomers with a specific cause and solution to the problem.
there are many ways to set up express.static (), and there are no problems.
example:

    app.use('/', express.static(__dirname + '/html'));
    app.use(express.static(path.join(dirname, 'html')));

problem:

    
express.static(),
express.static(),
express.static().

correct example:

    let express = require('express'),
        app = express(),
        path = require('path');
    //
    app.use('/', express.static(__dirname + '/html'));
    //app.use(express.static(path.join(__dirname, 'html')));
    //express.static()
    //,
    //
    
    app.all('*', function(req, res, next) {
        res.header("Access-Control-Allow-Origin", "*");
        res.header("Access-Control-Allow-Headers", "X-Requested-With");
        res.header("Access-Control-Allow-Methods","PUT,POST,GET,DELETE,OPTIONS");
        res.header("X-Powered-By",' 3.2.1');
        res.header("Content-Type", "application/json;charset=utf-8");
        next();
    });

if the answer is wrong, modify the message


did you launch the index.html in the dist folder or the index.html in public?

about express rendering static files,
app.use (express.static (path.join (_ _ dirname, 'public'));
you just modify the path of dist directly. You don't have to copy it into public. In this way, everything in public will be leaked, and others can get it. It's not safe. It's not recommended.

Menu