このサイトは Nuxt で作っているので amp-module (https://github.com/nuxt-community/amp-module) を使った。

導入はドキュメントに書いてある通り設定を行えばいい。 あとは、各ページを AMP に対応するように書き換えていけばいい。

AMP に沿っているかどうかは、 URL に #development=1 をつけて chrome で開発者ツールを開けば確認できる。

たとえば、 nuxt を dev で立ち上げると、purgecss で CSS が削除されずに tailwindcss がすべて出力されているため、 CSS のサイズ上限に引っかかっていることが表示されたりする。

こういうエラーに対してひとつづつ対応していけばよい。

で、対応を終えてデプロイをした。AMPには、AMPページであるログが出力される。

引き続き、ほかのページも対応していこうと思うが、追加しようと思っている機能が制限に引っかかると面倒なので、 amp-script などを使用して実装できるようにしていきたい。