importing jQuery with jade(with node.js + express)
Question
I got question about jade. I imported like follow, but it seems ignored.(When I inspect source with Chrome, can not find those resources :<)
extends layout
head block append
link(rel='stylesheet', href='/stylesheets/chat.css')
script(src="/socket.io/socket.io.js")
script(src="/javascripts/jquery-2.1.4.min.js")
script(src="/javascripts/chat.js")
How can I import these scripts?
Thanks !
//=============== This is what I get when 'page source' function of Chrome browser.
<!DOCTYPE html>
<html>
<head>
<title>Chat Sample</title>
<link rel="stylesheet" href="/stylesheets/style.css">
</head>
<body>
<h1>Chat</h1>
<label for="userName">User name: (Hit Enter)</label>
<input id="userName" type="text" size="30">
<span id="feedBack"></span>
<p> </p>
<div id="msgWindow" class="shadow">
</div>
<p> </p>
<div>
<br>
<table>
<tr>
<td>
<select id="users" style="width: 100px"></select>
</td>
<td>
<input id="msg" type="text" style="width: 600px" disabled="true">
</td>
</tr>
</table>
</div>
</body>
</html>
However, css file also does not applied to the page. I can get full contents of file, when I approach with url like http://localhost:3000/javascripts/jquery-2.1.4.min.js .
I have changed jquery version//
//===========Edit
Follow is the error. I can not understand why head is unexpected//
Warning: Unexpected block "head" on line 3 of /Users/juneyoungoh/Documents/Nodejs/ChatSample/views/chat.jade. This block is never used. This warning will be an error in v2.0.0
FYI, this is layout.jade
doctype html
html
head
title= title
link(rel='stylesheet', href='/stylesheets/style.css')
body
block content
2 answers
solution1
0 ACCPTED 2015-12-16 05:07:56
Never appended a block, but jade-lang.com is mentioning following syntax:
extends layout
block append head
link(rel='stylesheet', href='/stylesheets/chat.css')
script(src="/socket.io/socket.io.js")
script(src="/javascripts/jquery/jquery-1.7.2.min.js")
script(src="/javascripts/chat.js")
solution2
0 2015-12-16 05:41:10
I got the hint from Jannik's comment. Maybe a version problem. In conclusion, I edited layout.jade .
from
doctype html
html
head
title= title
link(rel='stylesheet', href='/stylesheets/style.css')
body
block content
to
doctype html
html
block head
title= title
link(rel='stylesheet', href='/stylesheets/style.css')
body
block content
I added block keyword.
FYI, I am using
- npm ver.2.12.1
- node ver.0.10.23
- express ver.3.4.7
and package.json like
{
"name": "application-name",
"version": "0.0.1",
"private": true,
"scripts": {
"start": "node app.js"
},
"dependencies": {
"express": "3.4.7",
"jade": "*"
}
}
Thanks for your help! :D
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.