Gatsbyで動画自動再生に手こずった（mp4） #JavaScript

サイトによくあるトップページの動画自動再生・・・

なかなか動かなくて調べました。

JSXとの兼ね合いで良い記事が見つからず、あれこれ試したが、
<vide src="/images/~~~~~~~.mp4"></video>では動かなかった。

<video autoPlay loop muted playsInline controls style={{ width:"100%" }}>
  <source src="/images/~~~~~~~.mp4" />
</video>

<source>タグを作って内側に書くという方法。

レスポンシブにするかはstyle={{ width:"100%" }}の部分をつけるか外すか。

※ここのHTMLなどをJSX記法に変換してくれるオンラインツール便利すぎた！！！
HTML to JSX Compiler