1

スタイラスの URL を機能させようとしています。url('/path/to/img.png')をbase64 エンコード形式に変換したいと思います。

ドキュメントhereに従おうとしていますが、あまり役に立ちません。

必要なビットとサンプル関数を追加してインポートしようとしましたが、urlこれを有効にする方法がわかりません。

これを機能させるにはどうすればよいですか？

アップデート：

grunt-image-embedプラグインを使用しようとしています。

これが私のうなり声の設定です：

imageEmbed: {
  dist: {
    src: [ "./public/local/css/images.css" ],
    dest: "./public/prod/css/images.css",
    options: {
      deleteAfterEncoding : false
    }
  }
},

css には以下が含まれます。

#footer-social .youtube {
  width: 18px;
  background-image: url('/img/youtube-icon.png');
}

エラーが発生します：

Warning: File C:\path\...\grunt-image-embed\tasks\lib\img\youtube-icon.png
does not exist Use --force to continue.

行を削除するbackground-imageと、すべてが機能し、正常に処理されます。local実際の画像への相対パスを使用しているため、css のパスを変更できません。

4

3 に答える 3

2

これを試して：

function compile(str, path) {
  return stylus(str)
            .define('url', stylus.url({
              paths : [__dirname + '/public'],
              limit : 10000
            }));
}

ここから：

http://bengourley.co.uk/using-stylus

ここでうまくいきました：

https://github.com/MichaelJCole/wintersmith-stylus/blob/master/plugin.coffee

これは coffeescript で、興味深い部分は次のとおりです。

      stylus(@_text, options)
      .use(nib())
      .define('url', stylus.url(
        paths : [__dirname + '/public']
        limit : locals.inlineSpriteMaxBytes || 0 ) )
      .render (err, css) ->
        if err
          callback err
        else
          callback null, new Buffer css
于 2013-09-18T23:17:40.703 に答える
0

どうすればスタイラスにならないのかわかりませんが、これを使用できます [1]: http://docs.emmet.io/actions/base64/

于 2013-08-23T14:48:39.770 に答える
-1

このうなり声のプラグインがまさに必要なものであることがわかると思います。うなり声画像埋め込み。画像とフォントの両方で機能します。ドキュメントから：

grunt.initConfig({
  imageEmbed: {
    dist: {
      src: [ "css/styles.css" ],
      dest: "css/output.css",
      options: {
        deleteAfterEncoding : false
      }
    }
  }
});
于 2013-08-24T17:02:51.953 に答える