Cannot read property 'create' of undefined

[devSarry]

I've basically just run through the set up and I cant seem to get the services bound to vue. Any suggestions?

Here's my client setup.

import Vue from 'vue'
import Resource from 'vue-resource'
import Router from 'vue-router'

// Install plugins
Vue.use(Router)
Vue.use(Resource)

// Set up a new router

const Feathers = require('feathers/client')
const hooks = require('feathers-hooks')
const authentication = require('feathers-authentication/client')
const socketio = require('feathers-socketio/client')
const io = require('socket.io-client')

const socket = io('http://localhost:3030/')
const feathers = Feathers()
    .configure(socketio(socket))
    .configure(hooks())
    .configure(authentication({storage: window.localStorage}))
console.log(feathers)
const vueFeathers = require('vue-feathers')

// And plug it in
Vue.use(vueFeathers, feathers)

Heres the component that is calling it.

    export default {
        name: "Chat",

        data() {
             return {
                 message: ''
             }
        },

        methods: {
            send(){
                this.$services.messages.create(this.message);
                console.log(this.$services);
            }
        }
    }

Error in browser

VM1043:1 Uncaught TypeError: Cannot read property 'create' of undefined
    at <anonymous>:1:24

[selbyk]

+1

Any luck?

[dortamiguel]

+1

[devSarry]

nope still nothing. I think the documentation is lacking how we register services

[lewebsimple]

You can use this.$feathers.service('messages') instead of this.$services.messages

[thewilli]

nope still nothing. I think the documentation is lacking how we register services

@dopyoman vue-feathers works by assigning the services object of the feathers instance as $services. And as the client doesn't know of any of your remote services, you have to tell your feathers instance about them.

That would be the following code for your initialization:

// your code: create feathers instance
const feathers = Feathers()
    .configure(socketio(socket))
    .configure(hooks())
    .configure(authentication({storage: window.localStorage}))
// new code: register service
feathers.service("messages");

after you've changed the code you can refer to your service as this.$services.messages from within your Vue component.

[ForsakenHarmony]

Yeah, you have to manually register every service