Vue.js graphql标记/加载程序:模块生成失败,GraphQLError:语法错误
我面临着一个奇怪的问题。使用Vue-CLI3Vue.js graphql标记/加载程序:模块生成失败,GraphQLError:语法错误,vue.js,webpack,graphql,babeljs,graphql-tag,Vue.js,Webpack,Graphql,Babeljs,Graphql Tag,我面临着一个奇怪的问题。使用Vue-CLI3npm运行serve 具有以下配置: // vue.config.js module.exports = { chainWebpack: config => { // GraphQL Loader config.module .rule('graphql') .test(/\.graphql$/) .use('graphql-tag/loader') .loader('graph
npm运行serve
具有以下配置:
// vue.config.js
module.exports = {
chainWebpack: config => {
// GraphQL Loader
config.module
.rule('graphql')
.test(/\.graphql$/)
.use('graphql-tag/loader')
.loader('graphql-tag/loader')
.end();
}
};
和一个.graphql
文件:
mutation AddOfficeMutation(
$name: String
$location: String
) {
createOffice(
input: {office: { name: $name, location: $location }}
) {
office {
id
name
location
}
}
}
运行npm run serve
时,出现以下错误:
ERROR Failed to compile with 1 errors 1:11:08 PM
error in ./src/graphql/AddOfficeMutation.graphql
Module build failed (from ./node_modules/graphql-tag/loader.js):
GraphQLError: Syntax Error: Unexpected Name "var"
at syntaxError (/Users/danroc/Dropbox/projects/tal-firebase/client-vue/node_modules/graphql/error/syntaxError.js:24:10)
at unexpected (/Users/danroc/Dropbox/projects/tal-firebase/client-vue/node_modules/graphql/language/parser.js:1490:33)
at parseDefinition (/Users/danroc/Dropbox/projects/tal-firebase/client-vue/node_modules/graphql/language/parser.js:153:9)
at many (/Users/danroc/Dropbox/projects/tal-firebase/client-vue/node_modules/graphql/language/parser.js:1520:16)
at parseDocument (/Users/danroc/Dropbox/projects/tal-firebase/client-vue/node_modules/graphql/language/parser.js:113:18)
at parse (/Users/danroc/Dropbox/projects/tal-firebase/client-vue/node_modules/graphql/language/parser.js:48:10)
at parseDocument (/Users/danroc/Dropbox/projects/tal-firebase/client-vue/node_modules/graphql-tag/src/index.js:129:16)
at gql (/Users/danroc/Dropbox/projects/tal-firebase/client-vue/node_modules/graphql-tag/src/index.js:170:10)
at Object.module.exports (/Users/danroc/Dropbox/projects/tal-firebase/client-vue/node_modules/graphql-tag/loader.js:44:18)
@ ./node_modules/cache-loader/dist/cjs.js??ref--12-0!./node_modules/babel-loader/lib!./node_modules/cache-loader/dist/cjs.js??ref--0-0!./node_modules/vue-loader/lib??vue-loader-options!./src/components/AddOfficeForm.vue?vue&type=script&lang=js& 29:0-69 59:18-35
@ ./src/components/AddOfficeForm.vue?vue&type=script&lang=js&
@ ./src/components/AddOfficeForm.vue
@ ./node_modules/cache-loader/dist/cjs.js??ref--12-0!./node_modules/babel-loader/lib!./node_modules/cache-loader/dist/cjs.js??ref--0-0!./node_modules/vue-loader/lib??vue-loader-options!./src/views/AddOfficeView.vue?vue&type=script&lang=js&
@ ./src/views/AddOfficeView.vue?vue&type=script&lang=js&
@ ./src/views/AddOfficeView.vue
@ ./src/router/routes.js
@ ./src/router/router-config.js
@ ./src/main.js
@ multi ./node_modules/@vue/cli-service/node_modules/webpack-dev-server/client?http://192.168.0.99:8080/sockjs-node (webpack)/hot/dev-server.js ./src/main.js
使用:
- “graphql”:“^14.0.2”
- “graphql标记”:“^2.10.0”
谢谢 我也面临同样的问题,似乎是两台装载机造成了崩溃 我已经安装了
graphql标签
和webpackgraphql加载器
尝试卸载包含apollo或graphql的每个软件包,然后再次使用
vue cli
重新安装<代码>vue添加阿波罗。它对我很有用。你在使用吗?是的,我用vue add apollo添加了它
我想插件已经在加载graphql标记/加载程序了,你通过自定义网页包规则运行了两次。你有没有在没有自定义规则的情况下尝试过,或者将文件重命名为.gql?谢谢,我想就是这样。我重新创建了该项目,没有将规则添加到vue.config.js中,它工作正常!