为手写笔设置自动编译
我已经在我的Mac上安装了node.js / stylus / nib，我可以在命令行上手动编译.styl文件到css。 我也知道有这个stylus.middleware（）的东西，当我search如何设置自动编译时，.styl改变，但我不知道我应该如何实现它（我从来没有使用节点。之前的js）。
我把这个代码放在哪个文件中？
我如何启动这个代码，以便它始终运行？
我想我在节点端遗漏了一些能够设置的东西。
从命令行你可以使用：
stylus -w folder/ 或者只是另一个例子：
stylus -w styl/*.styl -o css/
它会监视更改并编译所有位于该文件夹下的* .styl文件。
如果将stylus安装为全局程序包（ npm install stylus -g ），则系统上有一个手写笔二进制文件。
$ stylus -h Usage: stylus [options] [command] [< in [> out]] [file|dir ...] Commands: help [<type>:]<prop> Opens help info at MDC for <prop> in your default browser. Optionally searches other resources of <type>: safari opera w3c ms caniuse quirksmode Options: -i, --interactive Start interactive REPL -u, --use <path> Utilize the stylus plugin at <path> -U, --inline Utilize image inlining via data uri support -w, --watch Watch file(s) for changes and re-compile -o, --out <dir> Output to <dir> when passing files -C, --css <src> [dest] Convert css input to stylus -I, --include <path> Add <path> to lookup paths -c, --compress Compress css output -d, --compare Display input along with output -f, --firebug Emits debug infos in the generated css that can be used by the FireStylus Firebug plugin -l, --line-numbers Emits comments in the generated css indicating the corresponding stylus line --include-css Include regular css on @import -V, --version Display the version of stylus -h, --help Display help information
这简要介绍了一些Node基础知识。
0.组织代码。 将主节点应用程序代码放到项目根目录中的app.js文件中是一个惯例。
在app.js里面，东西被分成两个部分：
- 同步初始化：需要模块，build立目录，读取configuration，数据库连接等。阻塞的东西，所以他们必须存在或快速死亡。
- asynchronous应用程序任务：启动服务器，后台进程，自动编译CSS和JS，路由，I / O等事件循环中的事情。
1.编译应用程序时，将Stylus编译为CSS。 我们需要使用手写笔模块。 通常这是在app.js的顶部完成的，以保持依赖关系。
var stylus = require('stylus');
Node第一次运行app.js ，你需要这个JS模块来构build你的CSS。 这是基本的想法：
stylus.render(stylus-code-string, function(err, css) { if (err) throw err; console.log(css); });
这是官方Stylus Javascript API 。
要使用Node的强大function，您应该使用fs模块将触控笔文件读入缓冲区，然后将其转换为string，最后将其传递到stylus.render() 。 然后，将结果发送到目标文件。 由于这是构build过程的一部分，因此它可以是同步的。 但这不是你的问题
2.使用Stylus自动编译CSS作为后台进程。
这个函数产生一个child_process ，它监视一个.styl文件，并将包含的.styl文件编译成一个.css文件。 您不需要为此的模块，只安装stylus可执行文件，以便它在命令行上运行。 （你已经这样做了）。 这个例子是用手写笔版本0.5.0制作的 。 此外，您使用的文件夹path（例如build/styles和styles ）需要存在。
function watchStyles(sourcefile, destinationfolder) { var Stylus = child_process.spawn('stylus', ['--sourcemap', '-w', sourcefile, '--out', destinationfolder]); Stylus.stdout.pipe(process.stdout); // notifications: watching, compiled, generated. Stylus.stderr.pipe(process.stdout); // warnings: ParseError. Stylus.on('error', function(err) { console.log("Stylus process("+Stylus.pid+") error: "+err); console.log(err); }); // Report unclean exit. Stylus.on('close', function (code) { if (code !== 0) { console.log("Stylus process("+Stylus.pid+") exited with code " + code); } }); }
接下来，您需要在启动应用程序后的某个时间调用此函数。 作为源传递您的主.styl文件。 然后是你想要CSS去的目的地目录。
// check that you passed '-w' parameter if (process.argv[2] && (process.argv[2] == "-w")) { watchStyles('styles/app.styl', 'build/styles'); }
运行以下命令启动应用程序： $ node app.js -w
它有助于组织你的.styl文件在一个app.styl以便你的app.styl的内容看起来像这样：
@import 'layout' @import 'header' @import 'main' @import 'footer' @import 'modal' @import 'overrides'
** 我昨天在这里结束，并没有find正确的答案。 所以这个后续的任何人都跟我一样… **
我也有一个设置手写笔命令行的问题。 我一直试图在全球安装stylus
$ npm install -g stylus
并会得到错误。 我用grunt-contrib-stylus在一个项目中工作，但通过命令行我没有得到任何工作。
即使$stylus --version没有返回任何东西。 我试图更新npm ，它打破了npm ，所以我最终重新安装node重新安装npm 。 然后，我可以做一个新的安装$ sudo npm install -g stylus并可以得到--version 。
我也必须重新安装grunt和我通过npm全局安装的所有其他东西。
好，我编辑我的答案，因为你不想做一个主页，然后连接资产是没有意义的，不能帮助你…但也许这个…
http://thechangelog.com/post/3036532096/stylus-expressive-robust-feature-rich-css-language
在该网站上，您可以在底部find接近尾声的video，如何通过命令行使用手写笔…
HTH和抱歉的误解…
首先，在本地npm install stylus --save-dev笔npm install stylus --save-dev如果没有的话。
创build一个启动脚本，用于构build您的样式表，并在主触笔文件中检测到更改时重新构build：
startup.js
var fs = require('fs') var stylus = require('stylus') // Define input filename and output filename var styleInput = __dirname + '/dev/stylus/main.styl' var styleOutputFilename = 'main.css' var styleOutput = __dirname + '/static/' + styleOutputFilename var stylusPaths = [__dirname + '/dev/stylus', __dirname + '/dev/stylus/libs'] // Build stylesheet on first execute buildStyles(styleInput, styleOutput, stylusPaths) // Watch stylus file for changes. fs.watch(styleInput, function(eventType, filename) { if (filename) { buildStyles(styleInput, styleOutput, stylusPaths) } else { console.log('no filename found. probably platform doesnt support it.'); } }); function buildStyles(input, output, paths) { stylus(fs.readFileSync(input, 'utf-8')) .set('paths', paths) .set('include css', true) .set('watch', true) .render(function(err, css) { if (err) throw err; fs.writeFile(output, css, (err) => { if (err) throw err; console.log('👍 Stylesheet built successfully.'); }); }); }
在terminal中键入node startup.js 。 您将看到一条消息“样式表已成功构build”。 每当你改变主要手写笔文件。
在他们的网站上有关于手写笔javascript api的很好的文档。