跳至内容
在本页

Connect 中间件

Stylus 自带 Connect 中间件,用于在修改时自动编译 Stylus 表单。

stylus.middleware(options)

选项

使用给定的 options 返回 Connect 中间件。

`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
`sourcemap` Generates a sourcemap in sourcemaps v3 format
`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
`sourcemap` Generates a sourcemap in sourcemaps v3 format

示例

从 ./public 提供 .styl 文件

var app = connect();

app.middleware(__dirname + '/public');
var app = connect();

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

更改 srcdest 选项以更改加载 .styl 文件的位置和保存位置

var app = connect();

app.middleware({
  src: __dirname + '/stylesheets',
  dest: __dirname + '/public'
});
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');
}
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
})
var app = connect();

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