2017-06-20 10 views
-1

私のcssファイルとejsファイルとの接続に問題があります。私は標準のnode.js/express setupを持っていると思う。 main.css私のpublic/cssディレクトリにあるファイルを自分のビューにあるindex.ejsというファイルに接続しようとしています。 htmlとルーティングは正常に動作しています。ここに私のapp.jsコードです。自分のcssを自分のejsファイルにリンクできないのはなぜですか?

var express = require('express'); 
var path = require('path'); 
var favicon = require('serve-favicon'); 
var logger = require('morgan'); 
var cookieParser = require('cookie-parser'); 
var bodyParser = require('body-parser'); 

var index = require('./routes/index'); 
var users = require('./routes/users'); 
var contact = require('./routes/contact'); 
var register_form = require('./routes/register'); 


var app = express(); 

// view engine setup 
app.set('views', path.join(__dirname, 'views')); 
app.set('view engine', 'ejs'); 

// uncomment after placing your favicon in /public 
//app.use(favicon(path.join(__dirname, 'public', 'favicon.ico'))); 
app.use(logger('dev')); 
app.use(bodyParser.json()); 
app.use(bodyParser.urlencoded({ extended: false })); 
app.use(cookieParser()); 
app.use(express.static(path.join(__dirname, 'public'))); 

私のindex.ejsファイルでは、headタグの間にリンクを挿入しました。私はすべてのファイル名が正しいことを確認するためにトリプルチェックしました。 app.use(express.static(path.join(__dirname, 'public')));:あなたとあなたの静的ファイル(あなたがすべきなど)の場所を定義したapp.jsで

<head> 
    <title><%= title %></title> 
    <link type="text/css" rel='stylesheet' href='../public/css/main.css' /> 
    </head> 

答えて

1

。これにより、publicディレクトリから始まる絶対パスでcssなどの静的ファイルを参照することができます。

リンク線を <link type="text/css" rel='stylesheet' href='/css/main.css' />に変更しても問題はありません。

それはそれはあなたが例えばこれはトリックをしたviews/index.ejs -> views/pages/index.ejs

+0

移動(CSSのリンクを壊すことなく、あなたのテンプレートページを移動することができますように、この「絶対」パス機能を使用することをお勧めします!非常に良い絶対パスを知っています –

関連する問題