Gridsomeでデフォルトのindex.htmlを変更するには？

src/index.htmlを作ればオーバーライドされます

Gridsomeでは、srcディレクトリ直下においたindex.htmlファイルがデフォルトのindex.htmlをオーバーライドする仕様になっています。

index.htmlの中身を変更するのではなく、完全に置き換えてしまうので、必要な変数をindex.htmlに仕込んでおく必要があります。

変数は、

です。

公式ドキュメントのサンプルは下記のようになっています。

<!DOCTYPE html>
<html ${htmlAttrs}>
  <head>
    ${head}
  </head>
  <body ${bodyAttrs}>
    ${app}
    ${scripts}
  </body>
</html>

ここは、普通のHTMLとして動くので、独自にJavascript処理を入れることも可能です。