Question

我正在尝试使用npm作为我的task manager，我注意到Stylus CLI的一些奇怪的东西，我没有表现出来。

要在文件上运行Stylus CLI，我有两个选择 $ stylus styles/file.styl // basic
$ stylus < styles/file.styl // using stdin

在file.styl中，我正在使用@require包含一些带通配符的其他文件夹来获取文件夹中的所有文件。

@charset "UTF-8";

@require 'base/*';
@require 'modules/*';
@require 'theme/*';

因此，当我运行$ stylus styles/file.styl时，它运行正常，但如果我运行$ stylus < styles/file.styl，我会收到错误消息。

我能够通过更改我的样式文件中的@require调用来使其工作：

@charset "UTF-8";

@require 'styles/base/*';
@require 'styles/modules/*';
@require 'styles/theme/*';

但是我不知道为什么会这样，我怎么能修复它所以我可以通过命令行运行它。

目标是让它在CLI中正常运行，以便我可以在我的package.json中使用它并将其传输到其他任务，例如autoprefixer和combine-mq或{{1 }}。我正在尝试复制我在同一个项目中使用的css-pleeease，希望这会让我能够围绕整个过程。

由于

更新：我还应该将gulpfile.js作为参考，以便了解我的最终结果。这也是我要发布的答案。

package.json

然后我运行{ "name": "npm_BUILD", "version": "1.0.0", "description": "npm as a task manager", "main": "index.js", "scripts": { "test": "echo \"Error: no test specified\" && exit 1", "styles":"npm run styles:max && npm run styles:min", "styles:max": "stylus < styles/site.styl | autoprefixer -b 'last 2 versions' > styles/final.css", "styles:min": "cssmin < styles/final.css > styles/final.min.css" }, "author": "Jason Lydon @bushwa", "license": "ISC", "devDependencies": { "autoprefixer": "^5.1.1", "clean-css": "^3.2.2", "combine-mq": "^0.8.1", "concat": "^1.0.0", "cssmin": "^0.4.3", "filesize": "^3.1.2", "stylus": "^0.50.0" } }创建两个css文件，第二个文件缩小。

Answer 1

这与stylus是否知道顶级输入文件的文件系统路径有关。当你传递styles/file.styl的路径时，它会将require个调用解释为相对于styles/file.styl个文件而且一切都很好。当你管道到stdin时，手写笔只知道shell中你当前的工作目录，所以它解释了相对于它的相对路径，在你的情况下是styles的父目录。如果你去cd styles那么它可能会双向发挥作用。

我的建议是使用相对于顶级.styl文件的路径，因为这是非常合理的，只需确保cd进入该目录，然后再运行stylus。

Answer 2

我不确定这是否是最佳答案，但这对我有用......

所以，基于Peter Lyon的答案，我在package.json更新了我的命令，先跳到styles目录然后运行！

stylus < styles/site.styl | autoprefixer -b 'last 2 versions' > styles/final.css
成为
cd styles && stylus < site.styl | autoprefixer -b 'last 2 versions' > final.css

{
  "name": "npm_BUILD",
  "version": "1.0.0",
  "description": "npm as a task manager",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1",
    "styles":"npm run styles:max && npm run styles:min",
    "styles:max": "cd styles && stylus < site.styl | autoprefixer -b 'last 2 versions' > final.css",
    "styles:min": "cssmin < styles/final.css > styles/final.min.css"
  },
  "author": "Jason Lydon @bushwa",
  "license": "ISC",
  "devDependencies": {
    "autoprefixer": "^5.1.1",
    "clean-css": "^3.2.2",
    "combine-mq": "^0.8.1",
    "concat": "^1.0.0",
    "cssmin": "^0.4.3",
    "filesize": "^3.1.2",
    "stylus": "^0.50.0"
  }
}

我不会撒谎，这让我很高兴。

手写笔：为什么stdin在使用require时会产生不同的结果？

2 个答案: