Câu trả lời:
Trong chính của bạn app.js hoặc những gì đang ở vị trí của nó:
Thể hiện 4.x
if (app.get('env') === 'development') {
app.locals.pretty = true;
}Thể hiện 3.x
app.configure('development', function(){
app.use(express.errorHandler());
app.locals.pretty = true;
});Thể hiện 2.x
app.configure('development', function(){
app.use(express.errorHandler());
app.set('view options', { pretty: true });
});Tôi đặt bản in đẹp vào developmentvì bạn sẽ muốn hiệu quả hơn với 'xấu xí' production. Đảm bảo đặt biến môi trường NODE_ENV=productionkhi bạn đang triển khai trong sản xuất. Điều này có thể được thực hiện với một shtập lệnh bạn sử dụng trong trường 'tập lệnh' package.jsonvà được thực thi để bắt đầu.
Express 3 đã thay đổi điều này vì:
Cài đặt "tùy chọn xem" không còn cần thiết nữa, app.locals là các biến cục bộ được hợp nhất với res.render (), vì vậy [app.locals.pretty = true cũng giống như chuyển res.render (view, {khá : thật }).
promise, uglify-js, cssvà lexical-scopetrước khi nó sẽ chạy lại (nó sẽ xây dựng, nhưng vụ tai nạn theo yêu cầu đầu tiên). Tôi chỉ thêm một dòng.
app.locals.pretty = true
Để đầu ra html "định dạng đẹp" trong Jade / Express:
app.set('view options', { pretty: true });Trong express 4.x, hãy thêm phần này vào app.js của bạn:
if (app.get('env') === 'development') {
app.locals.pretty = true;
}Có một tùy chọn "khá" trong chính Jade:
var jade = require("jade");
var jade_string = [
"!!! 5",
"html",
" body",
" #foo I am a foo div!"
].join("\n");
var fn = jade.compile(jade_string, { pretty: true });
console.log( fn() );... giúp bạn điều này:
<!DOCTYPE html>
<html>
<body>
<div id="foo">I am a foo div!
</div>
</body>
</html>Tôi dường như không tinh vi lắm nhưng đối với những gì tôi đang theo đuổi - khả năng thực sự gỡ lỗi HTML mà quan điểm của tôi tạo ra - thật tuyệt.
Nếu bạn đang sử dụng bàn điều khiển để biên dịch, thì bạn có thể sử dụng một cái gì đó như thế này:
$ jade views/ --out html --prettyBạn có thực sự cần định dạng html độc đáo? Ngay cả khi bạn cố gắng xuất ra một cái gì đó trông đẹp mắt trong một trình soạn thảo, nó có thể trông lạ ở một trình soạn thảo khác. Cấp, tôi không biết bạn cần html để làm gì, nhưng tôi sẽ thử sử dụng các công cụ phát triển chrome hoặc fireorms cho Firefox. Những công cụ đó cung cấp cho bạn một cái nhìn tốt về DOM thay vì html.
Nếu bạn thực sự thực sự cần định dạng html độc đáo thì hãy thử sử dụng EJS thay vì ngọc. Điều đó có nghĩa là bạn phải tự định dạng html.
bạn có thể sử dụng gọn gàng
lấy ví dụ tập tin ngọc này:
foo.jade
h1 MyTitle
p
a(class='button', href='/users/') show users
table
thead
tr
th Name
th Email
tbody
- var items = [{name:'Foo',email:'foo@bar'}, {name:'Bar',email:'bar@bar'}]
- each item in items
tr
td= item.name
td= item.emailbây giờ bạn có thể xử lý nó với nút testjade.js foo.jade> output.html :
testjade.js
var jade = require('jade');
var jadeFile = process.argv[2];
jade.renderFile(__dirname + '/' + jadeFile, options, function(err, html){
console.log(html);
});sẽ cung cấp cho bạn s.th. giống:
đầu ra.html
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html><head><title>My Title</title><link rel="stylesheet" href="https://stackoverflow.com/stylesheets/style.css"/><script type="text/javascript" src="../js/jquery-1.4.4.min.js"></script></head><body><div id="main"><div ><h1>MyTitle</h1><p><a href="/users/" class="button">show users</a></p><table><thead><tr><th>Name</th><th>Email</th></tr></thead><tbody><tr><td>Foo</td><td>foo@bar</td></tr><tr><td>Bar</td><td>bar@bar</td></tr></tbody></table></div></div></body></htmlsau đó chạy nó gọn gàng với tidy -m output.html sẽ dẫn đến:
đầu ra.html
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta name="generator" content=
"HTML Tidy for Linux (vers 25 March 2009), see www.w3.org" />
<title>My Title</title>
<link rel="stylesheet" href="/stylesheets/style.css" type=
"text/css" />
<script type="text/javascript" src="../js/jquery-1.4.4.min.js">
</script>
</head>
<body>
<div id="main">
<div>
<h1>MyTitle</h1>
<p><a href="/users/" class="button">show users</a></p>
<table>
<thead>
<tr>
<th>Name</th>
<th>Email</th>
</tr>
</thead>
<tbody>
<tr>
<td>Foo</td>
<td>foo@bar</td>
</tr>
<tr>
<td>Bar</td>
<td>bar@bar</td>
</tr>
</tbody>
</table>
</div>
</div>
</body>
</html>xây dựng đề xuất của oliver, đây là một cách nhanh chóng và bẩn thỉu để xem html đẹp
1) tải gọn gàng
2) thêm phần này vào .bashrc của bạn
function tidyme() {
curl $1 | tidy -indent -quiet -output tidy.html ; open -a 'google chrome' tidy.html
}3) chạy
$ tidyme localhost:3000/pathlệnh mở chỉ hoạt động trên máy Mac. Hy vọng rằng sẽ giúp!
Trong express 4.x, hãy thêm phần này vào app.js của bạn:
app.locals.pretty = app.get('env') === 'development';