我希望能够创建一个网页临时文件目录,其中每个文件都是一个独立的页面.
使用常规HTML/CSS/JS非常简单:
<head>
<style>
p {
color: red;
}
</style>
</head>
<body>
<p>lololol</p>
</body>
Run Code Online (Sandbox Code Playgroud)
使用Jade/Stylus/CoffeeScript也同样容易:
head
:stylus
p
color red
body
p lololol
Run Code Online (Sandbox Code Playgroud)
问题是,没有明确的方式以这种方式使用Stylus插件.具体来说,我想使用colorspaces.js和nib来更有效地试验颜色:
head
:stylus
@import 'nib'
p
color CIELCH(20.470, 74.265, 314.113)
background-color linear-gradient(white, black)
body
p lololol
Run Code Online (Sandbox Code Playgroud)
您可以通过更改这些行来分叉Jade :
/**
* 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>';
},
Run Code Online (Sandbox Code Playgroud)
如果您安装Jade的依赖项(我必须npm install commander和npm install mkdirp),您可以导航到/jade_fork/bin/并执行./jade name_of_file.jade.
但出于维护原因,我宁愿留在翡翠的主要分支上.
更新:
这是我发现的最好的方法:
另存为例如~/bin/jade:
#!/usr/bin/env node
var jade = require('jade');
jade.filters.stylus = // your code from above
require('jade/bin/jade');
Run Code Online (Sandbox Code Playgroud)
它的工作原理与 完全相同/usr/local/bin/jade,只是它将使用您的代码来编译手写笔、笔尖等。
旧答案:
我建议你这样做:
var jade = require('jade');
jade.filters.stylus = // your code from above
jade.compile( /* ... */ );
Run Code Online (Sandbox Code Playgroud)
你失去了jade命令行脚本,但是你应该能够以这种方式编译你的文件,同时依赖于jade master。