连接中间件

¥Connect Middleware

Stylus 附带 Connect 中间件，用于在修改 Stylus 表时自动编译它们。

¥Stylus ships with Connect middleware for auto-compiling Stylus sheets whenever they're modified.

stylus.middleware(options)

选项

¥Options

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

¥Return Connect middleware with the given 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
`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

示例

¥Examples

从 ./public 提供 .styl 文件：

¥Serve .styl files from ./public:

var app = connect();

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

var app = connect();

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

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

¥Change the src and dest options to alter where .styl files are loaded and where they're saved:

var app = connect();

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

var app = connect();

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

这里我们设置了自定义编译函数，以便我们可以设置 compress 选项，或者定义其他函数。

¥Here we set up the custom compile function so that we may set the compress option, or define additional functions.

默认情况下，编译函数只是设置 filename 并渲染 CSS。在以下情况下，我们使用 "nib" 库插件压缩输出，并自动导入它。

¥By default the compile function simply sets the filename and renders the CSS. In the following case we're compressing the output, using the "nib" library plugin, and auto-importing it.

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');
}

将其作为选项传递，如下所示：

¥Pass it as an option like so:

var app = connect();

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

var app = connect();

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

连接中间件 #

stylus.middleware(options) #

选项 #

示例 #

连接中间件

stylus.middleware(options)

选项

示例