Quiero ser capaz de crear un directorio de archivos de páginas web, donde cada archivo es una página independiente.¿Es posible usar los complementos de Stylus con el código de Stylus en línea incrustado en un archivo de Jade?

Esto es bastante fácil con regularidad HTML/CSS/JS:

<head> 
    <style> 
     p { 
      color: red; 
     } 
    </style> 
</head> 
<body> 
    <p>lololol</p> 
</body>

Y es igualmente fáciles con Jade/Stylus/CoffeeScript:

head 
    :stylus 
     p 
      color red 
body 
    p lololol

Lo que pasa es que no hay manera clara de usa los plugins Stylus de esta manera. En concreto, me gustaría utilizar colorspaces.js y punta a experimentar con los colores de manera más eficaz:

head 
    :stylus 
     @import 'nib' 
     p 
      color CIELCH(20.470, 74.265, 314.113) 
      background-color linear-gradient(white, black) 
body 
    p lololol

La solución actualmente estoy usando

Puede tenedor Jade cambiando these lines como ese:

/** 
    * Transform stylus to css, wrapped in style tags. 
    */ 

    stylus: function(str, options){ 
+ colorspaces = require('colorspaces'); 
+ nib = require('nib'); 
    var ret; 
    str = str.replace(/\\n/g, '\n'); 
    var stylus = require('stylus'); 
- stylus(str, options).render(function(err, css){ 
+ stylus(str, options).use(colorspaces()).use(nib()).render(function(err, css){ 
     if (err) throw err; 
     ret = css.replace(/\n/g, '\\n'); 
    }); 
    return '<style type="text/css">' + ret + '</style>'; 
    },

Y si tu nstall las dependencias de Jade (tuve que npm install commander y npm install mkdirp), puede navegar a /jade_fork/bin/ y hacer ./jade name_of_file.jade.

Pero prefiero quedarme en la sucursal principal de Jade por motivos de mantenimiento.

Fuente

2012-09-05 Kelsey Higham

Actualización:

Aquí es la mejor manera que he encontrado:

Guardar como, por ejemplo, ~/bin/jade:

#!/usr/bin/env node 

var jade = require('jade'); 

jade.filters.stylus = // your code from above 

require('jade/bin/jade');

que funcionará exactamente como /usr/local/bin/jade, excepto que usará su código para compilar lápiz, con plumín etc.

vieja respuesta:

te sugiero que hagas es así:

var jade = require('jade'); 

jade.filters.stylus = // your code from above 

jade.compile(/* ... */);

Pierde en la secuencia de comandos de línea de comando de jade, pero debería poder compilar sus archivos de esta manera, mientras que depende de jade master.

Fuente

2012-09-05 10:27:28

Gracias, esta (la nueva respuesta) funciona muy bien! –

¿Es posible usar los complementos de Stylus con el código de Stylus en línea incrustado en un archivo de Jade?

La solución actualmente estoy usando

Respuesta

Cuestiones relacionadas