node.js - style - pug preprocesador html
¿Cómo puedo renderizar JavaScript en línea con Jade? (8)
El filtro :javascript fue eliminado en la versión 7.0
La documentación dice que debes usar una etiqueta de script ahora, seguida de a . Char y sin espacio precedente.
Ejemplo:
script.
if (usingJade)
console.log(''you are awesome'')
else
console.log(''use jade'')
será compilado para
<script>
if (usingJade)
console.log(''you are awesome'')
else
console.log(''use jade'')
</script>
Estoy intentando obtener JavaScript para representarlo en mi página utilizando Jade (http://jade-lang.com/)
Mi proyecto está en NodeJS con Express, todo funciona correctamente hasta que quiero escribir algo de JavaScript en línea en la cabeza. Incluso tomando los ejemplos de los documentos de Jade, no consigo que funcione. ¿Qué me estoy perdiendo?
Plantilla de jade
!!! 5
html(lang="en")
head
title "Test"
script(type=''text/javascript'')
if (10 == 10) {
alert("working")
}
body
Resultado del renderizado HTML en el navegador.
<!DOCTYPE html>
<html lang="en">
<head>
<title>"Test"</title>
<script type="text/javascript">
<if>(10 == 10) {<alert working></alert></if>}
</script>
</head>
<body>
</body>
</html>
Algo definitivamente una falta aquí alguna idea?
No usar etiqueta de script solamente.
Solución con | :
script
| if (10 == 10) {
| alert("working")
| }
O con una . :
script.
if (10 == 10) {
alert("working")
}
Para el contenido de varias líneas, jade normalmente usa una "|", sin embargo:
Las etiquetas que solo aceptan texto como script, estilo y área de texto no necesitan el encabezado | personaje
Dicho esto, no puedo reproducir el problema que está teniendo. Cuando pego ese código en una plantilla de jade, produce el resultado correcto y me avisa con una alerta en la carga de la página.
Revisaría tus espacios en blanco.
También puede traer su archivo JS como un incluir. Sé que no es una respuesta a lo que está mal, pero le resultará más fácil depurar su JS, ya que cualquier error termina por referirse a un número de línea en un archivo que es real.
TERCERA VERSIÓN DE MI RESPUESTA:
Aquí hay un ejemplo de varias líneas de jade Javascript en línea. No creo que puedas escribirlo sin usar un - . Este es un ejemplo de mensaje flash que utilizo en forma parcial. ¡Espero que esto ayude!
-if(typeof(info) !== ''undefined'')
-if (info)
- if(info.length){
ul
-info.forEach(function(info){
li= info
-})
-}
¿El código que está intentando obtener para compilar el código en su pregunta?
Si es así, no necesita dos cosas: primero, no necesita declarar que es Javascript / a script, puede comenzar a codificar después de escribir - ; segundo, después de escribir -if no es necesario que escriba { o } tampoco. Eso es lo que hace que Jade sea muy dulce.
-------------- RESPUESTA ORIGINAL A CONTINUACIÓN ---------------
Intenta anteponer if con - :
-if(10 == 10)
//do whatever you want here as long as it''s indented two spaces from
the `-` above
También hay toneladas de ejemplos de Jade en:
Use la etiqueta de script con el tipo especificado, simplemente inclúyalo antes del punto:
script(type="text/javascript").
if (10 == 10) {
alert("working");
}
Esto compilará para:
<script type="text/javascript">
if (10 == 10) {
alert("working");
}
</script>
Quería comentar la respuesta de liangzan, pero no tiene suficiente reputación. Espero que esto ayude
Utilice el :javascript filtro de :javascript . Esto generará una etiqueta de script y escapará del contenido del script como CDATA:
!!! 5
html(lang="en")
head
title "Test"
:javascript
if (10 == 10) {
alert("working")
}
body
simplemente use una etiqueta ''script'' con un punto después.
script.
var users = !{JSON.stringify(users).replace(/<///g, "<///")}
https://github.com/pugjs/pug/blob/master/examples/dynamicscript.pug