2

そのため、エクスプレス プロジェクトでスタイルシートを読み込む際に問題が発生しています。Express 2.5.8 を使用していたときはスタイルが正しく読み込まれていましたが、3.x に更新するとスタイルの読み込みに失敗し始めました。ビューはレンダリングされますが、スタイルはありません。

ノード、エクスプレス 3.x、ジェイド、およびブートストラップを使用しています。私のスタイルは ですpublic/stylesheets/*。

更新: 何らかの理由layout.jadeでレンダリングされていないようです。

ほら、私のserver.js

require('coffee-script');
/**
 * Module dependencies.
 */

var express = require('express'),
            flash = require('connect-flash');

var app = module.exports = express.createServer();

// Configuration

app.configure(function(){
  app.set('views', __dirname + '/views');
  app.set('view engine', 'jade');
  app.set('port', 3000);
  app.use(express.bodyParser());
  app.use(express.methodOverride());
  app.use(flash());
  app.use(require('connect-assets')());
  app.use(app.router);
  app.use(express.static(__dirname + '/public'));
});

app.configure('development', function(){
  app.use(express.errorHandler({ 
    dumpExceptions: true, 
    showStack: true 
  }));
});

app.configure('test', function () {
  app.set('port', 3001);
});

app.configure('production', function(){
  app.use(express.errorHandler());
});

// Routes

require('./apps/landing-page/routes')(app);
require('./apps/authentication/routes')(app);
require('./apps/home/routes')(app);
require('./apps/register/routes')(app);


app.listen(3000);
console.log("Express server listening on port %d in %s mode", app.settings.port, app.settings.env);

これが私の主なlayout.jade見解です：

!!!
html
  head
    title= title
    script(src='http://code.jquery.com/jquery-latest.js')
    link(rel='stylesheet', href='/stylesheets/bootstrap.css')
    link(rel='stylesheet', media='screen', href='/stylesheets/bootstrap-responsive.css')
    link(rel='stylesheet', href='/stylesheets/app.css')

    script(src='javascripts/bootstrap.js')

    |   <!--[if lt IE 9]>
    |   <link rel="stylesheet" href="stylesheets/ie.css">
    |   <![endif]-->

    |   <!-- IE Fix for HTML5 Tags -->
    |   <!--[if lt IE 9]>
    |     <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
    |   <![endif]-->

  body 
    !=body


script(src='javascripts/app.js')

そして、これが私のルートの1つです：

routes = (app) ->
    app.get '/home', (req, res) ->
        res.render "#{__dirname}/views/home",
        title: 'Home | SiteName'
        stylesheet: 'home'


module.exports = routes
4

2 に答える 2

3

Express 3 ではレイアウト レンダリングがデフォルトで設定されていると思われるfalseので、構成に以下を追加してみてください。

app.set('view options', { layout: true });

更新: 移行ガイドには、レイアウトとパーシャルの概念が完全に削除されたと記載されています。代わりに、Jade のテンプレート継承を使用してください。

/ビュー/レイアウト

!!! 5
head
    // all your header elements
body
    block content

/ビュー/ホーム

先頭に次を追加します。

extends layout

block content
    // the stuff you want to have in your content block

詳細については、このガイドをご覧ください。

于 2013-01-02T01:17:30.513 に答える
2 
app.use(express.static(__dirname + '/public'));

前でなければなりません

app.use(app.router);
于 2013-01-02T01:15:41.560 に答える