Closed2022/01/25にクローズ1

viteでUnable to parse HTML; URI malformedエラーが出た→svgファビコンが原因だった

viteでSPAのビルドをしようとしたところ、

[vite:build-html] 
Unable to parse HTML; URI malformed at .../src/index.html

というようなエラーが出るようになった。

調べてみるとvite-plugin-stringを使っているとこのエラーが出ることがあるようだが、今回のケースでは使っていなかった。

エラーが発生しているhtmlファイルを眺めてみると「URI malformed」感が漂う箇所がひとつあった。それが以下。

<link
      rel="icon"
      href="data:image/svg+xml,<svg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 100 100%22><text x=%2250%%22 y=%2250%%22 style=%22dominant-baseline:central;text-anchor:middle;font-size:90px;%22>😺</text></svg>"
    />

ファビコンとして絵文字を表示するためのものだが、これがアウト判定されていた模様。

おとなしくpng画像をファビコンに使うようにしたらビルドが通るようになった。

ちなみにviteの依存パッケージも合わせてアップデートしたので、エラーを発生させているのはviteではないかもしれない。

このスクラップは2022/01/25にクローズされました