Stylusの@importでcssを展開する


Stylusの@importでcssファイルを指定した場合でも，Stylusのファイルを指定した場合のようにファイルの中身を展開したい．

Stylusの文法だけで何とかできないでしょうか？

変換にはgulp-stylusを使っています．

[code]

    # a.css
    .a { font-size: 150%; }
    
    # s.styl
    @import "a.css"
    .s
      font-size 120%
    
    # コンパイル後
    @import "a.css"
    .s { font-size: 120%; }
    
    # こういう出力が欲しい
    .a { font-size: 150%; }
    .s { font-size: 120%; }
    
[/code]

* * *

追記 gulp-stylusでは下記で出来ました．

[code]

    stylus = require 'gulp-stylus'
    ..
    stylus {'include css':true}
    
[/code]




`stylus` コマンドの `\--include-css` オプションを使ってCSSへ変換してください。実行例:

[code]

    $ stylus --include-css b.styl
    
[/code]

このオプションはヘルプに記載がありまして `stylus -h` より抜粋しますと、以下のように説明されています。

[code]

    --include-css           Include regular CSS on @import
    
[/code]

試してみてください。

* * *

なお、それが実装されているのは
[このあたり](https://github.com/stylus/stylus/blob/9d39b64bb19d784280edd48b0608067a4e0fb37d/lib/visitor/evaluator.js#L880-L886)
です。




`stylus` コマンドの `\--include-css` オプションを使ってCSSへ変換してください。実行例:

[code]

    $ stylus --include-css b.styl
    
[/code]

このオプションはヘルプに記載がありまして `stylus -h` より抜粋しますと、以下のように説明されています。

[code]

    --include-css           Include regular CSS on @import
    
[/code]

試してみてください。

* * *

なお、それが実装されているのは
[このあたり](https://github.com/stylus/stylus/blob/9d39b64bb19d784280edd48b0608067a4e0fb37d/lib/visitor/evaluator.js#L880-L886)
です。

