用GraphQL定义JavaScript查询/突变的巧妙方法
也许只有我一个人，但我对用backticks定义我的GraphQL查询/突变非常恼火。这里的问题是，如果我必须对查询字符串进行一些更改，那么在后台重新格式化字符串是非常烦人的。
是否有一种聪明的方法可以用GraphQL定义更易读和更易于维护的JavaScript查询/突变？当查询字符串出现混乱时，也很难找到缺少的括号。
我现在就是这样做的：
import gql from 'graphql-tag';
export const fancyMutation = gql`
mutation($id: ID!)
{
delete_something(id:$id) {
id
foo
bar
}
}
`;回答 2
Stack Overflow用户
发布于 2018-07-24 08:40:23
您还可以将查询放入自己的文件中，例如具有.graphql或.gql文件扩展名的查询，以及从需要的文件加载查询的使用graphql-标记/加载程序。
在它自己的文件中给定这个查询：
query CurrentUserForLayout {
currentUser {
login
avatar_url
}
}对于webpack，您需要以下配置：
module: {
rules: [
{
test: /\.(graphql|gql)$/,
exclude: /node_modules/,
loader: 'graphql-tag/loader',
},
],
},然后你就可以像这样加载它：
import React, { Component } from 'react';
import { graphql } from 'react-apollo';
import currentUserQuery from './currentUser.graphql';
class Profile extends Component { ... }
Profile.propTypes = { ... };
export default graphql(currentUserQuery)(Profile)更新
您还可以在一个文件中进行多个查询：
query MyQuery1 {
...
}
query MyQuery2 {
...
}然后，您可以这样加载它们：
import { MyQuery1, MyQuery2 } from 'query.gql'除此之外，我不知道其他可以内联定义查询的选项。后排不是graphql特定的。它只是像es6模板标签一样使用样式组件来定义内联css。您唯一的选择是获得一个可以识别graphql查询的IDE，以提供编辑帮助和代码突出显示。IntelliJ编辑(IDEA，WebStorm，PyCharm)有一个插件，就像维克多·弗拉辛科指出的那样。
Stack Overflow用户
发布于 2018-07-24 08:26:46
从1.4.1版本开始的JS GraphQL WebStorm插件支持嵌入式GraphQL字符串。
从WebStorm菜单中选择File -> Settings -> Plugins -> Browse repositories并找到JS GraphQL插件。检查是否至少安装了1.4.1版本的插件。
安装时，应该突出显示大括号，并通过选择代码块和从IDE菜单中选择Code -> Reformat code来重新格式化字符串中的Code -> Reformat code。
这个插件项目页面位于这里：
https://stackoverflow.com/questions/51493335
复制相似问题
腾讯云开发者
