Desarrollo y diseño

Pug (Jade) compila el código dentro del tag equivocado

bazoo
bazoo #1 Jul '16

Estoy toqueteando un poco Pug (antes llamado Jade) y al compilar cierto archivo inserta el código en el tag equivocado (en title).

tables.pug

doctype html
html(lang='en')
  include ./parts/head.pug
    // DataTables CSS
    link(rel='stylesheet', href='../lib/datatables-plugins/integration/bootstrap/3/dataTables.bootstrap.css')

    // DataTables Responsive CSS
    link(rel='stylesheet', href='../css/compiled/responsive.dataTables.css')
  body
  //- blablabla...

/parts/head.pug

head
  meta(charset='utf-8')
  meta(http-equiv='X-UA-Compatible', content='IE=edge')
  meta(name='viewport', content='width=device-width, initial-scale=1')
  meta(name='description', content='')
  meta(name='author', content='')
  title CTR4Ever

  //- blablabla...

Resultado:

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="description" content="">
    <meta name="author" content="">

    <title>CTR4Ever
      <!-- DataTables CSS-->
      <link rel="stylesheet" href="../lib/datatables-plugins/integration/bootstrap/3/dataTables.bootstrap.css">
      <!-- DataTables Responsive CSS-->
      <link rel="stylesheet" href="../css/compiled/responsive.dataTables.css">
    </title>

  </head>

Como podeis ver, los tags <link> acaban siendo insertados dentro del tag <title>, sin importar dónde esté <title>

He probado con lo siguiente y nada. Haga lo que haga siempre se inserta dentro, justo después del contenido del title:

title= 'CTR4Ever'

title
  = 'CTR4Ever'

title
  != 'CTR4Ever'

title!= 'CTR4Ever'

- var siteTitle = 'CTR4Ever'
title!= siteTitle

Esto si funciona, pero no me parece la solución adecuada, solo un workaround.

- var siteTitle = 'CTR4Ever'
- var siteTitleHtml = '<title>' + siteTitle + '</title>'
!= siteTitleHtml

What the fuck?

¿Alguien sabe por qué pasa esto? ¿Alguna solución limpia? ¿Estoy haciendo algo mal y por eso se inserta en el sitio indebido?

D
DrasaR #2 Jul '16

Has probado a poner los link en el mismo nivel que el include? Los anidamientos en jade vienen por nivel de identado, si no recuerdo mal.

1 respuesta
bazoo
bazoo #3 Jul '16

#2 Si, ya lo había probado a ver si colaba, y 'funciona', pero estoy más o menos en las mismas. Lo que ocurre al hacer eso es lo siguiente:

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="description" content="">
    <meta name="author" content="">
    <title>CTR4Ever</title>

  </head>

  <!-- DataTables CSS-->
  <link rel="stylesheet" href="../lib/datatables-plugins/integration/bootstrap/3/dataTables.bootstrap.css">
  <!-- DataTables Responsive CSS-->
  <link rel="stylesheet" href="../css/compiled/responsive.dataTables.css">

  <body>

Los links quedan entre el <head> y el <body>. Firefox (al menos) desplaza automáticamente los links dentro del <head> pero no los comentarios. Los comentarios en principio no me importan en absoluto, pero sigue sin ser una solución 'limpia'.

Usuarios habituales

Tags