search

aws-amplify / amplify-category-api

The AWS Amplify CLI is a toolchain for simplifying serverless web and mobile development. This plugin provides functionality for the API category, allowing for the creation and management of GraphQL and REST based backends for your amplify project.
https://docs.amplify.aws/
Apache License 2.0
89 stars 79 forks source link

How to configure my IDE to autocomplete and highlight AppSync directives, scalar types and more? #114

Open cietho opened 2 years ago

cietho commented 2 years ago

Which Category is your question related to? GraphQL, Developer Experience, Jetbrains, PhpStorm, WebStorm

Amplify CLI Version 7.6.19

Provide additional details e.g. code snippets. Be sure to remove any sensitive data. Hey,

first of all: I love the CLI and the Developer Experience while working with Amplify. However, there is one issue that I haven't been able to solve very nicely and it's bothering me:

When I set up a fresh Amplify project with ampify init and then add a simple GraphQL API with amplify add api, I expect the CLI to create all the necessary files for me to develop the backend. And it does - but unfortunately my IDE (PhpStorm, which is actually WebStorm with PHP support) is not able to show me the directives correctly and the auto-completion doesn't work either. Instead I had to find the type definitions for AppSync on various sites and configure it myself.

Here is an example of what it looks like when I start a fresh project and configure nothing else: image

What I did to solve this issue? I've added an appsync.graphql file to my project. The content of the file can be found here: https://gist.github.com/cietho/87463cfa77ffa9917d1b1425e01049bd

Here is another example with appsync.graphql from the Gist above: image

I wish the CLI would download or generate something like this for me so that I don't have to do it manually. Is there an easier way? What have I overlooked? I am grateful for any tips.

Many thanks and best regards cietho

yuth commented 2 years ago

@cietho CLI does not provide automatic way to configure the project. I am marking this as a feature-request so the team can pick this up in future. 👍🏼 will help to get it prioritized.

festusyuma commented 1 year ago

@cietho Please in what directory did you place this appsync.graphql file and did you need to do any additional config. I've been trying to get it working here but no luck

cietho commented 1 year ago

@festusyuma I'll look at it over the weekend and give you a feedback.

Edit: Hey @festusyuma I took a closer look: I just created a aws.graphql file and put it somewhere in my project, e.g. into the root directory. The GraphQL Plugin for Webstorm scans this file automatically and resolves the directives, scalars etc. without any validation errors in my ./amplify/backend/api/<projet>/schema.graphql and autocomplete works as well.