错误：ENOENT：express-handlebars 中没有这样的文件或目录

Question

我正在使用express-handlebars在 NodeJS 中加载动态内容

里面 app.js

const express = require("express");
const bodyParser = require("body-parser");
const path = require("path");
const pp = require("./util/path.js");
const adminRoutes = require("./routes/admin");
const shopRoutes = require("./routes/shop");
const expressHbs = require("express-handlebars");
const app = express();

app.engine("hbs",expressHbs());
app.set("view engine", "hbs");
app.set("views", "views");

app.use(bodyParser.urlencoded({ extended: false }));
app.use(express.static(path.join(__dirname, "public")));

app.use("/admin", adminRoutes.routes);
app.use(shopRoutes);

app.use((req, res, next) => {
  res.status(404).render("404", { pageTitle: "Page Not Found" });
});
app.listen(3001, "localhost", () => console.log("Listening on 3001 PORT"));

当expressHbs()函数没有参数时，它显示以下错误

错误：ENOENT：没有那个文件或目录，打开'C:\dev\nodejs\maximi_course\views\layouts\main.handlebars'

当我将一个选项对象传递给它时：

app.engine(
  "hbs",
  expressHbs({
    extname: "hbs",
    layoutsDir: path.join(__dirname, "views")
  })
);

表明：

错误：ENOENT：没有那个文件或目录，打开'C:\dev\nodejs\maximi_course\views\main.hbs'

我已经搜索了一个解决方案，但我没有得到结果，实际上我正在学习一个教程，我和老师做了同样的事情，但我得到了一个错误。

我尝试过的最后一件事是添加defaultLayout属性，它可以工作并加载默认值，但是当我将 url 更改为另一个页面时，它总是加载我设置为默认值的相同页面

这是项目文件夹及其所有内容

Answer 1

我遇到了同样的问题并使用以下方法修复了它：

app.engine(
  "hbs",
  expressHbs({
    extname: "hbs",
    defaultLayout: false,
    layoutsDir: "views/layouts/"
  })
);

Answer 2

express-handlebars.js@4.0.1 定义了以下配置选项

function ExpressHandlebars(config) {
    // Config properties with defaults.
    utils.assign(this, {
        handlebars     : Handlebars,
        extname        : '.handlebars',
        layoutsDir     : undefined, // Default layouts directory is relative to `express settings.view` + `layouts/`
        partialsDir    : undefined, // Default partials directory is relative to `express settings.view` + `partials/`
        defaultLayout  : 'main',
        helpers        : undefined,
        compilerOptions: undefined,
    }, config);

如果你不使用默认布局，你可以defaultLayout: false像下面这样设置

app.engine(
  "hbs",
  expressHbs({
    extname: "hbs",
    defaultLayout: false
  })
);

Answer 3

需要将 defaultLayout 设置为 false，否则“express-handlebars”将搜索 main.handlebars。

app.engine("hbs", expressHbs({ defaultLayout: false }));
app.set("view engine", "hbs");
app.set("views", "views");

Answer 4

实际上，这是一个有点烦人的问题express-handlebars，但已解决如下：

• 我必须创建一个独立文件，该文件不是其中之一Routes并将其名称分配给defaultLayout
• 我必须将路径设置为views/layouts/
• 我必须定义extname我定义的扩展

app.engine(
  "hbs",
  expressHbs({
    extname: "hbs",
    defaultLayout: "main-layout",
    layoutsDir: "views/layouts/"
  })
);