在express-handlebars中注册部分内容

Question

我正在尝试将我的部分内容注册到我的应用程序中。我不知道该怎么做。无论我从其他堆栈问题中得到什么答案，它对我来说都不起作用......

我设置了快速车把

import { engine } from 'express-handlebars';

//I use modules so without this(don't know what it does) doesn't work
const __filename = new URL(import.meta.url).pathname;
const __dirname = path.dirname(__filename);

app.set('view engine', 'hbs');
app.set('views', './views');
app.engine('hbs', engine({
    extname: '.hbs',
    partialsDir: path.join(__dirname, 'views', 'partials')
}));

我有以下目录格式：

我创建布局格式并导入正文和标题：

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>{{title}}</title>
    <script src="https://cdn.tailwindcss.com"></script>
</head>
<body>
    {{> header }}

    {{{body}}}

</body>
</html>

然后，在部分文件夹中我创建标题：

<header>
    <p>Wellcome back back</p>
</header>

完成这一切之后，我的应用程序找不到部分名称标题：

Error: The partial header could not be found
    at Object.invokePartial (C:\Users\sasda\Desktop\websockets\node_modules\handlebars\dist\cjs\handlebars\runtime.js:332:11)
    at Object.invokePartialWrapper [as invokePartial] (C:\Users\sasda\Desktop\websockets\node_modules\handlebars\dist\cjs\handlebars\runtime.js:84:39)
    at Object.eval [as main] (eval at createFunctionContext (C:\Users\sasda\Desktop\websockets\node_modules\handlebars\dist\cjs\handlebars\compiler\javascript-compiler.js:262:23), <anonymous>:13:28)
    at main (C:\Users\sasda\Desktop\websockets\node_modules\handlebars\dist\cjs\handlebars\runtime.js:208:32)
    at ret (C:\Users\sasda\Desktop\websockets\node_modules\handlebars\dist\cjs\handlebars\runtime.js:212:12)
    at ret (C:\Users\sasda\Desktop\websockets\node_modules\handlebars\dist\cjs\handlebars\compiler\compiler.js:519:21)
    at ExpressHandlebars._renderTemplate (C:\Users\sasda\Desktop\websockets\node_modules\express-handlebars\dist\express-handlebars.js:244:16)
    at ExpressHandlebars.<anonymous> (C:\Users\sasda\Desktop\websockets\node_modules\express-handlebars\dist\express-handlebars.js:156:31)
    at Generator.next (<anonymous>)
    at fulfilled (C:\Users\sasda\Desktop\websockets\node_modules\express-handlebars\dist\express-handlebars.js:10:58)

Answer 1

我使用模块导入JS文件：

{
  "name": "websockets",
  "version": "1.0.0",
  "description": "",
  "module": "true",
  "type": "module",
  "main": "server.js",
  "scripts": {
    "dev": "nodemon server.js"
  },

到目前为止，我尝试将路径与导入模块一起使用。它给了我如下错误：

file:///C:/Users/sasda/Desktop/websockets/app.js:23
app.use(expres.static(path.join(__dirname, 'public')));
                                ^

ReferenceError: __dirname is not defined in ES module scope
This file is being treated as an ES module because it has a '.js' file extension and 'C:\Users\sasda\Desktop\websockets\package.json' contains "type": "module". To treat it as a CommonJS script, rename it to use the '.cjs' file extension.

幸运的是，我尝试用

./views/partials

或我需要在 app.js 中导入的任何内容来编写硬编码路径。后来我找到了以下帮手。

const __filename = fileURLToPath(import.meta.url);
const __dirname = dirname(__filename);

我不明白它为什么起作用，但最终我能够使用部分和视图，而无需对路径进行硬编码：

import { create } from 'express-handlebars';
import { fileURLToPath } from 'url';
import { dirname } from 'path';



const __filename = fileURLToPath(import.meta.url);
const __dirname = dirname(__filename);

/**
 *  Serve and set the handlebars engine
*/
app.use(expres.static(path.join(__dirname, 'public')));

const hbs = create({
    extname:        '.hbs',
    partialsDir:    path.join(__dirname, 'views', 'partials'),
    layoutsDir:     path.join(__dirname, 'views', 'layouts')
});
app.engine('hbs', hbs.engine);
app.set('view engine', 'hbs');
app.set('views', path.join(__dirname, 'views'));

我的文件夹结构保持不变：

在express-handlebars中注册部分内容

问题描述投票：0回答：1

1个回答

最新问题

在express-handlebars中注册部分内容

问题描述 投票：0回答：1

1个回答

最新问题

问题描述投票：0回答：1