vue.js - GraphQL Apollo 客户端 (PhpStorm) 中的格式/Prettyprint gql `template strings`

Question

当我有

query: gql`query FetchUsers { users {  id   email }}`

什么是使它看起来像这样的快速方法：

 query: gql`query FetchUsers {
                users {
                    id
                    email
                }
            }`

或者我是否需要以其他方式插入 GraphQL 表达式以获得可读的格式？

Answer 1

您可以安装和配置prettier到您的项目。然后为 Webstorm 安装Prettier 插件，它将为 Webstorm 添加一个Reformat with Prettier操作和键盘快捷键。您还可以将其配置为与文件观察程序一起使用，以便在您保存文件时自动重新格式化文件。

除此之外，如果您的 GraphQL 服务器正在运行 GraphiQL 或 GraphQL Playground，那么这两个工具都有一个“美化”功能来重新格式化查询。或者你可以使用一些在线工具，比如Sangria 的这个工具。