Vue component registration

Question

I have imported the component in the js file

import fmsSubUnitDetails from '../subunitDetails';

export default{
 components: {
    fmsSubUnitDetails
  },
}

in the index.vue file

<fmsSubUnitDetails></fmsSubUnitDetails>

but still getting error

[Vue warn]: Unknown custom element: - did you register the component correctly? For recursive components, make sure to provide the "name" option.

I have tried changing path like adding or removing '/' in the import, it renders the component but as soon as I hard refresh, the component stops rendering again.

Answer 1

Is it a recursive component? If so, I think you need to use the same name you defined on the component (or the kebab version of it)

export default { 
    name: 'SubUnitDetails', 
    data() { 
        return { properties };
    }
}

import SubUnitDetails from '../subunitDetails';

export default {
    components: { SubUnitDetails },
}

<SubUnitDetails></SubUnitDetails >