Handlebars/Node/Express無法加載文件

因此，我正在開發基本CRUD操作的Node/Express webapp，並且我很難在項目中實施Handlebars。Handlebars/Node/Express無法加載文件

當我嘗試使用句柄時，我的.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，但沒有能夠得到其中的任何工作的嘗試。

任何幫助將不勝感激！

謝謝！

來源

2017-01-12 AHijaouy

嘗試把「商」文件夾中的「公共」文件夾內。之後根據需要調整您的代碼。公共文件夾外的任何靜態文件都不會顯示，請記住這一點，並想象這些文件在服務器啓動並運行時如何相互作用。 – Sombriks

我認爲可能的是，問題是出在車把上的配置，請看看這樣的配置：

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',}));

，如果你are usign app.set(express.static(__dirname + '/public'));

嘗試在公用文件夾中放入你的樣式，例如bootstrap文件夾，然後你所要做的就是以這種方式調用它：

<link href="/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet">

來源

2017-01-12 15:35:31 FaztJs

我認爲這不是問題的原因是因爲它正確加載了我的index.hbs的基本HTML，它只是沒有正確加載樣式。另外請注意，我甚至還沒有使用任何手柄特定的東西。目前它只是原始的HTML CSS和一些基本的JS文件。 – AHijaouy

加入我的上述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) {

來源

2017-01-12 16:45:05 AHijaouy

這個效果很好，:-) – Sombriks

Handlebars/Node/Express無法加載文件

回答

相關問題