所以我正在为基本的CRUD操作开发Node / Express webapp,而且我很难在项目中实现Handlebars。
当我尝试使用把手时,我的.hbs(以前的.html)页面中的所有样式表都没有加载。
这是文件树:
以下是来自
的脚本导入语句的示例index.hbs
<!-- Bootstrap -->
<link href="../vendors/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet">
最后这里是server.js文件
var express = require('express'),
bodyParser = require('body-parser'),
path = require('path'),
mysql = require('mysql'),
dbconfig = require('./config/database'),
exphbs = require('express-handlebars');
var connection = mysql.createConnection(dbconfig.connection)
connection.query('USE ' + dbconfig.database);
var app = express();
//Body Parser Middleware
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({extended: false}));
//Set static path
//app.use(express.static(path.join(__dirname, 'public')));
//app.use(express.static(__dirname + '/public'));
//app.set('views', __dirname + '/views');
//app.use('/views', express.static(path.join(__dirname, '/views')));
app.engine('hbs', exphbs({defaultLayout: false}));
app.set('view engine', 'hbs');
app.set(express.static(__dirname + '/public'));
//app.use('/views/vendors', express.static(path.join(__dirname, '/views/vendors')));
//app.use(express.static(__dirname + '/public/vendors'));
app.get('/', function(req, res) {
res.render('index');
connection.query("SELECT * FROM Student", function(err, rows){
console.log(rows);
});
});
app.listen(80, function() {
console.log('we are live on 80');
});
我尝试使用我在SO上找到的其他东西的各种静态路径,但是无法使其中任何一个工作。
任何帮助将不胜感激!!
谢谢!
答案 0 :(得分:2)
通过在app.get上添加以下行来解决我的问题('/'=
app.use("/vendors",express.static(__dirname + "/vendors"));
app.use("/build",express.static(__dirname + "/build"));
app.use("/images",express.static(__dirname + "/images"));
app.get('/', function(req, res) {
答案 1 :(得分:0)
我认为问题出在车把配置上是可能的,请看一下这样的配置:
app.engine('.hbs',exphbs({
defaultLayout:'layouts',
layoutsDir:path.join(app.get('views'),'layouts'),
partialsDir:path.join(app.get('views'),'partials'),
extname:'.hbs',
helpers: helpers
}));
app.set('view engine','hbs');
也许在你的身上会是:
app.engine('hbs', exphbs({defaultLayout: false, extname:'.hbs',}));
如果您使用app.set(express.static(__dirname + '/public'));
尝试将你的样式放在公共文件夹中,例如bootstrap文件夹,然后你要做的就是用这种方式调用它:
<link href="/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet">