UGA Boxxx

つぶやきの延長のつもりで、知ったこと思ったこと書いてます

SVG

【SVG】url-loader使ってimportしたsvgアイコンがsafariで表示できなかった

SVG

自社サイトをスマホでみてみたらアイコンが全部表示されていない障害をみつけてしまった 原因は最近対応したこれだった uga-box.hatenablog.com webpackのurl-loaderをつかって、スプライトSVGをimportするようにして、次のようにSVGアイコンを実装していた <svg> <use href={sprite + "#icon-star"} /></use></svg>…

【SVG】ReactでSVGスプライトを利用する

SVG

この記事ですが、スマホの実機でみたらアイコンが表示されなくなってしまったので、使えませんでした。デスクトップPCだけなら問題ないです。 いままでReactでSVGスプライトをインラインで使うため、react-svg-inlineというモジュールを利用していたが3年ほ…

【SVG】svg-spriteをつくる

SVG

過去にgulpをつかってsvgスプライトを作っていたが、久々にアイコンを更新しようと思ったらgulp taskが動かなかった もはやgulpに依存しなくて良いと思うので、別の方法を探してみる 調べた感じsvg-sprite-generatorを使うのがよさそう github.com だが、軽…