Javascript Node JS，Express&；帕格犬混乱-链接/路线

我安装了Node.js、Express和Pug，还以为我在做一个MVC应用程序。然而，虽然我希望我的前端页面（主页、关于、联系、登录）包含（连接到后端的数据片段），但我可以使用pug（在视图下）创建这些页面

在我的公用文件夹下，将这些页面作为静态页面并附加样式表，不是会快得多吗？当然，我相信它们需要被编译成HTML，这样它们才能工作

我想要做的就是创建导航，简单地用帕格链接这些页面，然而，当运行NPM时，我总是收到404个错误（尽管它今天早上工作）

如果我可以用帕格轻松地做到这一点，并且只需要放置一个链接，那么为什么我要在后端创建路由呢？有人能澄清一下吗

Pug（Sep导航文件）

快线

app.get("/about", (req, res) => {
  res.render("about");
});


app.get("/contact", (req, res) => {
  res.render("contact");
});

app.get("/login", (req, res) => {
  res.render("login");
});

应用程序js

var createError = require('http-errors');
var express = require('express');
var path = require('path');
var cookieParser = require('cookie-parser');
var logger = require('morgan');

var indexRouter = require('./routes/index');
var usersRouter = require('./routes/users');

var app = express();

// View Engine ----------------------------
app.set('views', path.join(__dirname, 'views'));
app.set('view engine', 'pug');

app.use(logger('dev'));
app.use(express.json());
app.use(express.urlencoded({ extended: false }));
app.use(cookieParser());
app.use(express.static(path.join(__dirname, 'public')));

// Routes
app.use('/', indexRouter);
app.use('/users', usersRouter);

app.get("/about", (req, res) => {
  res.render("about");
});


app.get("/contact", (req, res) => {
  res.render("contact");
});

app.get("/login", (req, res) => {
  res.render("login");
});




// catch 404 and forward to error handler
app.use(function(req, res, next) {
  next(createError(404));
});

// error handler
app.use(function(err, req, res, next) {
  // set locals, only providing error in development
  res.locals.message = err.message;
  res.locals.error = req.app.get('env') === 'development' ? err : {};

  // render the error page
  res.status(err.status || 500);
  res.render('error');
});

module.exports = app;

---

我以前使用过Django，尽管它的MVT（非常类似），但我认为它要简单得多，并且我能够将它插入HTML页面。

它可能是

a（href=“/about”）

，这只是为了确定，但是没有斜杠的版本也应该可以工作，这取决于它在地址栏中的内容。说到这里，当你点击一个断开的链接后，你的地址栏上写了什么？此外，如果express设置正确，您完全可以提供一组静态HTML文件。（pug）模板的思想主要是在渲染期间将动态数据插入其中。示例：

res.render（“profile”，{user:req.session.user}）

Hi Chris，感谢您的回复。在地址栏中，它只是显示（尽管仍然抛出404错误）路由代码本身看起来很好，因此问题一定是代码的其余部分。秩序是重要的；我假设你在设置路线后正在调用

.listen（）

？我已经了解了你的意思.list（），相信它是一个调用函数，我刚刚添加了app.js文件（其中大部分是我今天早上在express网站上看到的文章），我确实想知道为什么这部分不在那里。我测试了你的代码，现在是这样的，转到

localhost:3000/about

，可以看到我的

about.pug的内容
var createError = require('http-errors');
var express = require('express');
var path = require('path');
var cookieParser = require('cookie-parser');
var logger = require('morgan');

var indexRouter = require('./routes/index');
var usersRouter = require('./routes/users');

var app = express();

// View Engine ----------------------------
app.set('views', path.join(__dirname, 'views'));
app.set('view engine', 'pug');

app.use(logger('dev'));
app.use(express.json());
app.use(express.urlencoded({ extended: false }));
app.use(cookieParser());
app.use(express.static(path.join(__dirname, 'public')));

// Routes
app.use('/', indexRouter);
app.use('/users', usersRouter);

app.get("/about", (req, res) => {
  res.render("about");
});


app.get("/contact", (req, res) => {
  res.render("contact");
});

app.get("/login", (req, res) => {
  res.render("login");
});




// catch 404 and forward to error handler
app.use(function(req, res, next) {
  next(createError(404));
});

// error handler
app.use(function(err, req, res, next) {
  // set locals, only providing error in development
  res.locals.message = err.message;
  res.locals.error = req.app.get('env') === 'development' ? err : {};

  // render the error page
  res.status(err.status || 500);
  res.render('error');
});

module.exports = app;