如果将Banckend打包在NodeJS中，则应在 webpack.config.js 文件和中对其进行配置> typings.d.ts 文件，因此编辑器和打包程序都知道这些文件.

If you are packaging the banckend in NodeJS, it should be configured in the webpack.config.js file and in the typings.d.ts files, so both the editor and the packager knows about these files.

typings.d.ts :

declare module "*.graphql" {
    const value: any;
    export default value;
}

代码:

import * as query from query.graphql

要使其正常工作，可以为使用Webpack的人员使用诸如raw-loader之类的加载器.

For this to work, a loader such as raw-loader for those using Webpack will work.

module: {
  rules: [
    { test: /\.json$/, loader: 'json-loader' },
    { test: /\.html$/, loader: 'raw-loader' },
    { test: /\.graphql$/, loader: 'raw-loader' },
  ]

此示例摘自 https://github.com/apollographql/graphql-tools/issues/273 ，其中有关于不同方法的积极讨论.

This sample has been taken from https://github.com/apollographql/graphql-tools/issues/273 where there's an active discussion about different approaches.

这是一个GitHub存储库，其功能大致相同，但具有更强大的解决方案: https://github.com/webpack-contrib/copy-webpack-plugin

Here is a GitHub repo which does roughly the same but with a more powerful solution: https://github.com/webpack-contrib/copy-webpack-plugin

另一方面，如果您要包装正面，则有一个方便的插件可以为您完成工作: https://www.npmjs.com/package/webpack-graphql-loader

On the other hand, if you are packaging the front, there's a handy plugin to do the work for you: https://www.npmjs.com/package/webpack-graphql-loader