Stylus 连接中间件 Connect Middleware

🌙
手机阅读
本文目录结构

连接中间件

有了连接中间件,无论Stylus片段什么时候改变,这些片段都能够自动编译。

stylus.middleware(options)

选项

返回给定options下的连接中间件。

`serve`     Serve the stylus files from `dest` [true]
`force`     Always re-compile
`src`       Source directory used to find .styl files
`dest`      Destination directory used to output .css files
            when undefined defaults to `src`.
`compile`   Custom compile function, accepting the arguments
           `(str, path)`.
`compress`  Whether the output .css files should be 
            compressed
`firebug`   Emits debug infos in the generated css that can
            be used by the FireStylus Firebug plugin
`linenos`   Emits comments in the generated css indicating 
            the corresponding stylus line

上面中文翻译如下:

`serve`     从 `dest` 提供stylus文件 [true]
`force`     总是重新编译
`src`       资源目录用来查找 .styl 文件
`dest`      `src`默认为undefined时,用来输出 .css 文件的目标目录
`compile`   自定义编译函数,接受参数`(str, path)`.
`compress`  是否输出的 .css 文件要被压缩
`firebug`   生成的CSS中发出调试信息,可被Firebug插件FireStylus使
            用
`linenos`   生成的CSS中发出注解,表明响应的stylus行

例子

./public提供.styl文件。

var app = connect();

app.middleware(__dirname + '/public');

改变src以及dest项来修改.styl文件哪里被加载,哪里被保存。

var app = connect();

app.middleware({
  src: __dirname + '/stylesheets',
  dest: __dirname + '/public'
});

这里我们建立自定义的编译函数,这样,我们就能设置compress项,或是定义附加的函数。

默认情况下,编译函数是简单地设置filename以及渲染CSS. 在下面这个例子中,我们压缩输出内容,使用"nib"库插件,以及自动导入。

function compile(str, path) {
  return stylus(str)
    .set('filename', path)
    .set('compress', true)
    .use(nib())
    .import('nib');
}

作为选项传递应该像这样:

var app = connect();

app.middleware({
    src: __dirname
  , dest: __dirname + '/public'
  , compile: compile
})

AXIHE / 精选资源

浏览全部教程

面试题

学习网站

前端培训
自己甄别

前端书籍

关于朱安邦

我叫 朱安邦,阿西河的站长,在杭州。

以前是一名平面设计师,后来开始接接触前端开发,主要研究前端技术中的JS方向。

业余时间我喜欢分享和交流自己的技术,欢迎大家关注我的 Bilibili

关注我: Github / 知乎

于2021年离开前端领域,目前重心放在研究区块链上面了

我叫朱安邦,阿西河的站长

目前在杭州从事区块链周边的开发工作,机械专业,以前从事平面设计工作。

2014年底脱产在老家自学6个月的前端技术,自学期间几乎从未出过家门,最终找到了满意的前端工作。更多>

于2021年离开前端领域,目前从事区块链方面工作了