awsのサーバーレスアーキテクチャとしてamplifyというものがあります。
サーバーを建てずにJavaScriptのフレームワークを動かすツール、Googleのfirebaseみたいなツールですね。
で、これのvue-jsのチュートリアルを見るとこれ、vue-cliを使ってフレームワークを構築しているのですが、やっぱりvue-cliを使うよりもnuxt.jsを使ったほうが今どきな感じも受けますね。
そんなわけで試してみたのですが、いくつかハマる点があり苦戦。
というわけでハマったところをいくつか書いていきましょう。
## srcディレクトリとdistディレクトリ
amplifyの初期化時、srcディレクトリとdistディレクトリを指定しないといけません。
が、vue-cliだとinit時srcディレクトリが生成されるものの、nuxtにはsrcディレクトリが無い。
色々調べていたら、YouTube動画で~/と指定しているのを発見。
これでうまくいくっぽいです。
distディレクトリはそのまんまで。
## build、serve
vue-cliはnpm run-script buildでdistディレクトリに吐き出されるのですが、nuxtはこれだとdistディレクトリが作られない。
のでpublishに失敗します。
というわけで、ビルドスクリプトはnpm run-script generateにしましょう。
これならうまくいきます。
間違えてamplify initしちゃった場合は
amplify/.config/project-config.json
ここをいじればいい感じです。