はじめに
- amplifyの開発を進めていたが、デプロイ時のエラーをどうしても解決できず、１度環境を壊して再構築した。
※windowsのwsl環境で開発しております。
ローカルのnodejsを削除とインストール
- 環境を最新にする
sudo apt-get update
- nodejsアンインストール
npm uninstall -g npm sudo apt-get remove nodejs
- nvm削除
rm -rf $NVM_DIR
-nvm install
curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.39.1/install.sh | bash ※v.039.1の箇所は最新バージョンを指定するようにする nvm install node
Amplify Setup Instructions
STEP1 amplify configure
$ amplify configure ? region: ap-northeast-1 ? user name: (amplify-vINdB) <specify any user name> ※Here open browser.AWS Console setting completely.Complete the configuration in the AWS Console. ? accessKeyId: ******************** ? secretAccessKey: **************************************** ? Profile Name: <specify any user name>
STEP2 amplify init
$ amplify init ? Initialize the project with the above configuration? [No] ? Enter a name for the environment [prod] ? Choose your default editor: [Visual Studio Code] ? Choose the type of app that you're building [javascript] Please tell us about your project ? What javascript framework are you using [react] ? Source Directory Path: [src] ? Distribution Directory Path: [.next] ? Build Command: [npm run-script build] ? Start Command: [npm run-script start] Using default provider awscloudformation ? Select the authentication method you want to use: [AWS profile]
STEP3 amplify add api
$ amplify add api ? Select from one of the below mentioned services: [GraphQL] ? Here is the GraphQL API that we will create. Select a setting to edit or continue [Continue] ? Choose a schema template: [One-to-many relationship (e.g., “Blogs” with “Posts” and “Comments”)] ✔ Do you want to edit the schema now? (Y/n) · [yes]
下記のように既存のschemaを変更してみた。
input AMPLIFY { globalAuthRule: AuthRule = { allow: public } } # FOR TESTING ONLY!
type Blog @model {
id: ID!
name: String!
posts: [Post] @hasMany
categories: [Category] @hasMany
}
type Category @model {
id: ID!
name: String!
isPublished: Boolean!
blog: Blog @belongsTo
post: Post @belongsTo
}
type Post @model {
id: ID!
title: String!
body: String!
created_at: AWSDateTime!
updated_at: AWSDateTime!
isPublished: Boolean!
blog: Blog @belongsTo
categories: [Category] @hasMany
comments: [Comment] @hasMany
}
type Comment @model {
id: ID!
post: Post @belongsTo
content: String!
}
STEP4 amplify push
$ amplify push
? Are you sure you want to continue? [Yes]
? Do you want to generate code for your newly created GraphQL API [Yes]
? Choose the code generation language target [typescript]
? Enter the file name pattern of graphql queries, mutations and subscriptions [src/graphql/**/*.ts]
? Do you want to generate/update all possible GraphQL operations - queries, mutations and subscriptions [Yes]
? Enter maximum statement depth [increase from default if your schema is deeply nested] [5] ※デフォルトは２だが、念のため５階層に
? Enter the file name for the generated code [src/API.ts]
# This "input" configures a global authorization rule to enable public access to
# all models in this schema. Learn more about authorization rules here: https://docs.amplify.aws/cli/graphql/authorization-rules
input AMPLIFY { globalAuthRule: AuthRule = { allow: public } } # FOR TESTING ONLY!
STEP5 amplify hosting add
✔ Select the plugin module to execute · [Hosting with Amplify Console (Managed hosting with custom domains, Continuous deployment)] ? Choose a type [ Continuous deployment (Git-based deployments)] ※The browser starts up here.
STEP6 amplify publish
? Are you sure you want to continue? Yes
