How to use graphql-tag - 10 common examples

protected _gql(node: FragmentDefinitionNode | OperationDefinitionNode): string {
    const doc = this._prepareDocument(`
    ${
      print(node)
        .split('\\')
        .join('\\\\') /* Re-escape escaped values in GraphQL syntax */
    }
    ${this._includeFragments(this._transformFragments(node))}`);

    if (this.config.documentMode === DocumentMode.documentNode) {
      const gqlObj = gqlTag(doc);

      if (gqlObj && gqlObj['loc']) {
        delete gqlObj.loc;
      }

      return JSON.stringify(gqlObj);
    } else if (this.config.documentMode === DocumentMode.string) {
      return '`' + doc + '`';
    }

    return 'gql`' + doc + '`';
  }

if (!fragment) {
    throw new Error(`Fragment "${fragmentName}" not registered.`)
  }

  // pad the literals array with line returns for each subFragments
  const literals = [fragment.fragmentText, ...fragment.subFragments.map(x => '\n')];
  
  // console.log(`// getFragment: ${parentFragmentName ? parentFragmentName + ' > ' : ''}${fragmentName}`)
  // console.log('fragmentText: ', fragment.fragmentText)
  // console.log('subFragments:', fragment.subFragments)
  // console.log('length:', fragment.subFragments.length)

  // the gql function expects an array of literals as first argument, and then sub-fragments as other arguments
  const gqlArguments = [literals, ...fragment.subFragments.map(f => getFragment(f, fragmentName))];

  return gql.apply(null, gqlArguments);
}

return cxs(el)(props => {
        try {
            const parsedQuery = isGqlQuery(query)
                ? query
                : internalGql(buildQuery(interleave(query, interpolations), props).join(""));

            return smoosh(graphql(resolver, parsedQuery, styles));
        } catch (e) {
            // eslint-disable-next-line no-console
            console.error("Not a valid gql query. Did you forget a prop?");
            return {};
        }
    });
};

// get pipeline expanding config from localStorage
    const expandConfig = this.getConfig();

    const extendedProps = {
      ...this.props,
      stages: this.state.stages,
      isExpanded: expandConfig[index],
      onToggle: value => this.setConfig(value)
    };

    return ;
  }
}

const PipelineContainerWithData = compose(
  graphql(gql(mutations.stagesUpdateOrder), {
    name: 'stagesUpdateOrderMutation'
  }),
  graphql(gql(mutations.stagesChange), {
    name: 'stagesChangeMutation'
  })
)(PipelineContainer);

class StagesWithPipeline extends React.Component<{ stagesQuery: any }> {
  render() {
    const { stagesQuery } = this.props;

    if (stagesQuery.loading) {
      return ;
    }

    const stages = stagesQuery.dealStages;

queryId: string,
    options: WatchQueryOptions
  ): Promise {
    const {
      variables,
      forceFetch = false,
      returnPartialData = false,
      noFetch = false,
    } = options;

    const {
      queryDoc,
      fragmentMap,
    } = this.transformQueryDocument(options);
    const queryDef = getQueryDefinition(queryDoc);
    const queryString = print(queryDoc);
    const querySS = {
      id: 'ROOT_QUERY',
      typeName: 'Query',
      selectionSet: queryDef.selectionSet,
    } as SelectionSetWithRoot;

    // If we don't use diffing, then these will be the same as the original query, other than
    // the queryTransformer that could have been applied.
    let minimizedQueryString = queryString;
    let minimizedQuery = querySS;
    let minimizedQueryDoc = queryDoc;
    let storeResult: any;

    // If this is not a force fetch, we want to diff the query against the
    // store before we fetch it from the network interface.
    if (!forceFetch) {

process(src) {
    // call directly the webpack loader with a mocked context
    // as graphql-tag/loader leverages `this.cacheable()`
    return loader.call({ cacheable() {} }, src);
  },
};

process(src) {
    // call directly the webpack loader with a mocked context 
    // as graphql-tag/loader leverages `this.cacheable()`
    return loader.call({ cacheable() {} }, src);
  },
};

process(source) {
    return loader.call({
      cacheable() {
        // empty
      }
    }, source)
  }
}

export const getFragmentObject = (fragmentText, subFragments) => {
  // pad the literals array with line returns for each subFragments
  const literals = subFragments ? [fragmentText, ...subFragments.map(x => '\n')] : [fragmentText];

  // the gql function expects an array of literals as first argument, and then sub-fragments as other arguments
  const gqlArguments = subFragments ? [literals, ...subFragments.map(subFragmentName => {
    // return subfragment's gql fragment
    if (!Fragments[subFragmentName] || !Fragments[subFragmentName].fragmentObject) {
      throw new Error(`Subfragment “${subFragmentName}” of fragment “${extractFragmentName(fragmentText)}” has not been initialized yet.`);
    }
    return Fragments[subFragmentName].fragmentObject;
  })] : [literals];

  return gql.apply(null, gqlArguments);
}

export const getFragmentObject = (fragmentText, subFragments) => {
  // pad the literals array with line returns for each subFragments
  const literals = subFragments ? [fragmentText, ...subFragments.map(x => '\n')] : [fragmentText];

  // the gql function expects an array of literals as first argument, and then sub-fragments as other arguments
  const gqlArguments = subFragments ? [literals, ...subFragments.map(subFragmentName => {
    // return subfragment's gql fragment
    if (!Fragments[subFragmentName] || !Fragments[subFragmentName].fragmentObject) {
      throw new Error(`Subfragment “${subFragmentName}” of fragment “${extractFragmentName(fragmentText)}” has not been initialized yet.`);
    }
    return Fragments[subFragmentName].fragmentObject;
  })] : [literals];

  return gql.apply(null, gqlArguments);
};