无法让 express-handlebars 呈现 HTML 页面
Can't get express-handlebars render an HTML page
我正在关注如何呈现 HTML 页面的 NodeJS tutorial,但我似乎无法让它工作。我安装了所有要求并使用 --save
选项,因此它位于我的 node_modules
文件夹中。在我执行 npm start
并访问我的 localhost
之后,这是我收到的错误消息:
Error: No default engine was specified and no extension was provided.
at new View (C:\Users\Billy\NodeJSProjects\HelloWorld\node_modules\express\lib\view.js:62:11)
at EventEmitter.render (C:\Users\Billy\NodeJSProjects\HelloWorld\node_modules\express\lib\application.js:570:12)
at ServerResponse.render (C:\Users\Billy\NodeJSProjects\HelloWorld\node_modules\express\lib\response.js:966:7)
at app.get (C:\Users\Billy\NodeJSProjects\HelloWorld\app\index.js:25:12)
at Layer.handle [as handle_request] (C:\Users\Billy\NodeJSProjects\HelloWorld\node_modules\express\lib\router\layer.js:95:5)
at next (C:\Users\Billy\NodeJSProjects\HelloWorld\node_modules\express\lib\router\route.js:137:13)
at Route.dispatch (C:\Users\Billy\NodeJSProjects\HelloWorld\node_modules\express\lib\router\route.js:112:3)
at Layer.handle [as handle_request] (C:\Users\Billy\NodeJSProjects\HelloWorld\node_modules\express\lib\router\layer.js:95:5)
at C:\Users\Billy\NodeJSProjects\HelloWorld\node_modules\express\lib\router\index.js:281:22
at Function.process_params (C:\Users\Billy\NodeJSProjects\HelloWorld\node_modules\express\lib\router\index.js:335:12)
./index.js
require('./app/index')
const path = require('path')
const express = require('express')
const exphbs = require('express-handlebars')
const app = express()
app.engine('.hbs', exphbs({
defaultLayout: 'main',
extname: '.hbs',
layoutsDir: path.join(__dirname, 'views/layouts')
}))
app.set('view engine', '.hbs')
app.set('views', path.join(__dirname, 'views'))
./app/index.js
const express = require('express')
const app = express()
app.use((request, response, next) => {
console.log(request.headers)
next()
})
app.get('/', (request, response) => {
response.render('home', {
name: 'John'
})
})
app.get('/', (request, response) => {
throw new Error('oops')
})
app.use((err, request, response, next) => {
// log the error, for now just console.log
console.log(err)
response.status(500).send('Something broke!')
})
app.listen(3000)
(自动生成)package.json
{
"name": "name-first-nodejs-app",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"start": "node index.js",
"test": "mocha test",
"your-custom-script": "echo npm"
},
"author": "",
"license": "ISC",
"dependencies": {
"async": "^2.3.0",
"express": "^4.15.2",
"express-handlebars": "^3.0.0",
"handlebars": "^4.0.6",
"lodash": "^4.17.4",
"promise-async": "^0.2.0"
},
"devDependencies": {
"mocha": "^3.3.0"
}
}
./views/layouts/main.hbs
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Express handlebars</title>
</head>
<body>
{{{body}}}
</body>
</html>
./views/home.hbs
<h2>Hello {{name}}</h2>
您正在制作两个单独的 app
对象并在其中一个上配置车把并在另一个上配置您的路线。因此,带有您的路线的路线未针对车把进行配置。您只需要在两个模块之间共享一个 app
对象。您可以将其从一个导出并将该模块导入另一个,或者在加载模块以访问单个共享 app
后使用模块构造函数或方法将 app
对象传递给另一个] 来自另一个模块的对象。
例如:
./index.js
const path = require('path');
const express = require('express');
const exphbs = require('express-handlebars');
const app = express();
app.engine('.hbs', exphbs({
defaultLayout: 'main',
extname: '.hbs',
layoutsDir: path.join(__dirname, 'views/layouts')
}));
app.set('view engine', '.hbs');
app.set('views', path.join(__dirname, 'views'));
// now that handlebars is configured,
// configure all our routes on this app object
require('./app/index')(app);
./app/index.js
module.exports = function(app) {
app.use((request, response, next) => {
console.log(request.headers);
next();
});
app.get('/', (request, response) => {
response.render('home', {
name: 'John'
});
});
app.use((err, request, response, next) => {
// log the error, for now just console.log
console.log(err)
response.status(500).send('Something broke!')
});
app.listen(3000);
};
我正在关注如何呈现 HTML 页面的 NodeJS tutorial,但我似乎无法让它工作。我安装了所有要求并使用 --save
选项,因此它位于我的 node_modules
文件夹中。在我执行 npm start
并访问我的 localhost
之后,这是我收到的错误消息:
Error: No default engine was specified and no extension was provided.
at new View (C:\Users\Billy\NodeJSProjects\HelloWorld\node_modules\express\lib\view.js:62:11)
at EventEmitter.render (C:\Users\Billy\NodeJSProjects\HelloWorld\node_modules\express\lib\application.js:570:12)
at ServerResponse.render (C:\Users\Billy\NodeJSProjects\HelloWorld\node_modules\express\lib\response.js:966:7)
at app.get (C:\Users\Billy\NodeJSProjects\HelloWorld\app\index.js:25:12)
at Layer.handle [as handle_request] (C:\Users\Billy\NodeJSProjects\HelloWorld\node_modules\express\lib\router\layer.js:95:5)
at next (C:\Users\Billy\NodeJSProjects\HelloWorld\node_modules\express\lib\router\route.js:137:13)
at Route.dispatch (C:\Users\Billy\NodeJSProjects\HelloWorld\node_modules\express\lib\router\route.js:112:3)
at Layer.handle [as handle_request] (C:\Users\Billy\NodeJSProjects\HelloWorld\node_modules\express\lib\router\layer.js:95:5)
at C:\Users\Billy\NodeJSProjects\HelloWorld\node_modules\express\lib\router\index.js:281:22
at Function.process_params (C:\Users\Billy\NodeJSProjects\HelloWorld\node_modules\express\lib\router\index.js:335:12)
./index.js
require('./app/index')
const path = require('path')
const express = require('express')
const exphbs = require('express-handlebars')
const app = express()
app.engine('.hbs', exphbs({
defaultLayout: 'main',
extname: '.hbs',
layoutsDir: path.join(__dirname, 'views/layouts')
}))
app.set('view engine', '.hbs')
app.set('views', path.join(__dirname, 'views'))
./app/index.js
const express = require('express')
const app = express()
app.use((request, response, next) => {
console.log(request.headers)
next()
})
app.get('/', (request, response) => {
response.render('home', {
name: 'John'
})
})
app.get('/', (request, response) => {
throw new Error('oops')
})
app.use((err, request, response, next) => {
// log the error, for now just console.log
console.log(err)
response.status(500).send('Something broke!')
})
app.listen(3000)
(自动生成)package.json
{
"name": "name-first-nodejs-app",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"start": "node index.js",
"test": "mocha test",
"your-custom-script": "echo npm"
},
"author": "",
"license": "ISC",
"dependencies": {
"async": "^2.3.0",
"express": "^4.15.2",
"express-handlebars": "^3.0.0",
"handlebars": "^4.0.6",
"lodash": "^4.17.4",
"promise-async": "^0.2.0"
},
"devDependencies": {
"mocha": "^3.3.0"
}
}
./views/layouts/main.hbs
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Express handlebars</title>
</head>
<body>
{{{body}}}
</body>
</html>
./views/home.hbs
<h2>Hello {{name}}</h2>
您正在制作两个单独的 app
对象并在其中一个上配置车把并在另一个上配置您的路线。因此,带有您的路线的路线未针对车把进行配置。您只需要在两个模块之间共享一个 app
对象。您可以将其从一个导出并将该模块导入另一个,或者在加载模块以访问单个共享 app
后使用模块构造函数或方法将 app
对象传递给另一个] 来自另一个模块的对象。
例如:
./index.js
const path = require('path');
const express = require('express');
const exphbs = require('express-handlebars');
const app = express();
app.engine('.hbs', exphbs({
defaultLayout: 'main',
extname: '.hbs',
layoutsDir: path.join(__dirname, 'views/layouts')
}));
app.set('view engine', '.hbs');
app.set('views', path.join(__dirname, 'views'));
// now that handlebars is configured,
// configure all our routes on this app object
require('./app/index')(app);
./app/index.js
module.exports = function(app) {
app.use((request, response, next) => {
console.log(request.headers);
next();
});
app.get('/', (request, response) => {
response.render('home', {
name: 'John'
});
});
app.use((err, request, response, next) => {
// log the error, for now just console.log
console.log(err)
response.status(500).send('Something broke!')
});
app.listen(3000);
};