Vue CLI 3与阿波罗冲突

时间:2018-09-22 06:47:00

标签: javascript vue.js vuejs2 apollo

我正在关注本教程,但偶然发现了一些问题。当我导入Apollo时,Apollo Boost控制台充满了错误

import ApolloClient from "apollo-boost"; //import apollo-boost
import VueApollo from "vue-apollo"; // import vue-apollo

Vue.use(VueApollo); // use apollo

// Setup ApolloClient
const defaultClient = new ApolloClient({
    uri: "http://localhost:4000/graphql"
});

const apolloProvider = new VueApollo({ defaultClient }); // implementing provider

Vue.config.productionTip = false;

new Vue({ // vue constructor
    provide: apolloProvider.provide(), // provide
    router,
    store,
    render: h => h(App)
}).$mount("#app");

控制台"error in ../node_modules/graphql/index.mjs"

中的错误

我找到了此解决方案https://github.com/vuejs/vue-cli/issues/1637,但不知道如何实现。他们将一些代码粘贴到vue.config.js上,但是我有babel.config.js,它们是一样的吗?

2 个答案:

答案 0 :(得分:0)

如您提到的GitHub链接中所述,解决方案是通过vue.config.js配置Webpack,该vue.config.js是Vue CLI项目中的可选文件。默认情况下会忽略该文件,因此,如果该文件不存在,则必须创建该文件。

从Vue CLI docs

  

@vue/cli-service是一个可选的配置文件,如果它存在于项目根目录中(package.json之后),它将由vue自动加载。您还可以使用package.json中的def array = [ "release-3.0.0-1-a6gbd6", "release-3.0.0-10-h7bdbc", "release-3.0.0-12-7hbs6", "release-3.0.0-23-9sz6gd", "release-3.0.0-3-g6h8xd", ] 字段,但是请注意,在这种情况下,您将只能使用JSON兼容值。

答案 1 :(得分:0)

尝试

new Vue({
  router,
  store,
  apolloProvider,
  render: h => h(App)
}).$mount('#app')