My jade file is as follows:
!!! 5
html(lang="en")
head
title test page
body
h1 hello world
But it renders as:
!!! 5
<html lang="en">
<head>
<title>test page</title>
</head>
<body>
<h1>hello world</h1>
</body>
</html>
I've tried just !!! as well as doctype - all render as text. Any ideas?
Check if your file has a byte order mark in the beginning, if it does - remove it.
Some windows editors add it in order to distinguish endiannes.
Related
I'm trying to add a sound to my chrome extension. It is my understanding it must be done in a service worker and that is where I have it:
chrome.tts.speak("Hit has been queued",{"lang": "en-US","rate":2.0});
However, when this executes I get this error:
caught error - Cannot read properties of undefined (reading 'speak')
It almost looks like a syntax error in the argument list but I don't see it. Can someone spot what I'm doing wrong? TIA
Updated HTML page without running as an extension
<!doctype html>
<html lang="en">
<head>
<title>
Alert
</title>
</head>
<body>
<script>
chrome.tts.speak("Hit added to queue",{"lang":"US-en","rate":2.0});
</script>
</body>
</html>
Updated per suggestion
alert.html
<!doctype html>
<html lang="en">
<head>
<title>
Alert
</title>
</head>
<body>
<script type="application/x-javascript" src="alert.js">
</script>
</body>
</html>
alert.js
chrome.tts.speak("Hit added to queue",{"lang":"US-en","rate":2.0});
I just installed Emmet, and when I type html TAB I only get
<html></html>
Before then, when I did so, Sublimetext would create all the default tags:
<!DOCTYPE html>
<html>
<head>
<title></title>
</head>
<body>
</body>
</html>
Is there a setting or something I can update in Emmet, or Sublime text so that when I have Emmet enabled, I can get the "full" tags?
The file is a .html file, and it's set to HTML in Sublime.
Here's a quick .gif - I start with Emmet diabled:
In Sublime Text 3 it's
html:5 + tab
Returns:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
</body>
</html>
In Sublime Text 3 you can type <h, and you will get
<!DOCTYPE html>
<html>
<head>
<title></title>
</head>
<body>
</body>
</html>
Also you should make document type HTML
on mine, html + TAB gives me what you're getting, but if I do html + ENTER, then I get the entire boilerplate.
I've created the following snippet on sublime text:
<snippet>
<content><!DOCTYPE html>
<html>
<head>
<meta charset='UTF-8'>
<title>Document</title>
</head>
<body>
</body>
</html></content>
<tabTrigger>!</tabTrigger>
</snippet>
But when attempting to save it, I get the following error:
"error parsing snippet xml: unexpected end of data in file"
Why is this?
Yours sincerely and thank you for all your help.
You may have accidentally removed the <![CDATA[ and ]] portions of the sample snippet XML; as a result sublime can't figure out where the content of the snippet ends.
You want something more like this:
<snippet>
<content><![CDATA[
<!DOCTYPE html>
<html>
<head>
<meta charset='UTF-8'>
<title>Document</title>
</head>
<body>
$0
</body>
</html>]]></content>
<tabTrigger>!</tabTrigger>
</snippet>
Note that I've added a $0 into the snippet inside the body tags; that tells Sublime where to drop the cursor after it has expanded the snippet, so that you're ready to continue editing the HTML document; you may or may not want to have that depending on what you're trying to do.
I have a question about including scripts from blocks
From express-generator,
layout.jade
doctype html
html
head
title= title
link(rel='stylesheet', href='/stylesheets/style.css')
body
block content
include sidebar
script(src='/javascripts/jquery.js')
block bottomscripts
sidebar.jade
block bottomscripts
script(src='/javascripts/sidebar.js')
output
<html>
<head>
<title>Express</title>
<link rel="stylesheet" href="/stylesheets/style.css">
</head>
<body>
<h1>Express</h1>
<p>Welcome to Express</p>
<script src="/javascripts/sidebar.js">
</script><script src="/javascripts/jquery.js"></script>
</body>
</html>
how can i move sidebar.js below jquery.js ? i need this done inside sidebar.jade
thank you
Have you tried including jquery.js in your block? Seems like they are both "bottomscripts".
block bottomscripts
script(src='/javascripts/jquery.js')
script(src='/javascripts/sidebar.js')
So can move your include statement and change the indentation of your jquery sctipt statement to
doctype html
html
head
title= title
link(rel='stylesheet', href='/stylesheets/style.css')
body
block content
script(src='/javascripts/jquery.js')
include sidebar
block bottomscripts
to get
<!DOCTYPE html>
<html>
<head>
<title></title>
<link rel="stylesheet" href="/stylesheets/style.css">
</head>
<body>
<script src="/javascripts/jquery.js"></script>
<script src="/javascripts/sidebar.js"></script>
</body>
</html>
If I set the following in my app.js file, why can't I access it using app.settings.title rather than settings.title in my rendered view? It seems I cannot prefix it with the app object.
...
app.set('title','TestApplication');
...
Why must I do this,
<!DOCTYPE html>
<html lang='en'>
<head>
<title><%= settings.title %></title>
</head>
<body>
</body>
</html>
rather than this?
<!DOCTYPE html>
<html lang='en'>
<head>
<title><%= app.settings.title %></title>
</head>
<body>
</body>
</html>
There is probably a simply answer to this question, but I am new to Javascript and am trying to learn Expressjs and Nodejs.
Thanks
Because variable is extracted before getting to view.
Because express provides some abstraction at the view level. It would be redundant and potentially insecure to expose app to your view, and so it's abstracted away so that you can just directly access settings.