Vue component only shows up as Tag and didnt gets rendered
One component on my vue site isn`t rendered correctly. It is registered like a lot of other components, they are working fine. But when i call only appears in the DOM. Why is this component behaving so strangely?
/index.vue
<template>
<emailResults></emailResults>
</template>
<script>
import { emailResults } from ../components;
export default {
components: {
emailResults
}
};
</script>
/emailResults.vue
<template>
...
</template>
<script>
export default {
name: 'emailResults',
}
</script>
/index.js
import emailResults from './emailResults'
export{
emailResults
}
vue.js vue-component
add a comment |
One component on my vue site isn`t rendered correctly. It is registered like a lot of other components, they are working fine. But when i call only appears in the DOM. Why is this component behaving so strangely?
/index.vue
<template>
<emailResults></emailResults>
</template>
<script>
import { emailResults } from ../components;
export default {
components: {
emailResults
}
};
</script>
/emailResults.vue
<template>
...
</template>
<script>
export default {
name: 'emailResults',
}
</script>
/index.js
import emailResults from './emailResults'
export{
emailResults
}
vue.js vue-component
Can you explain more because I didn't get what you're asking
– Harsh Patel
Jan 3 at 12:22
Ok so the component isn´t rendered corretly but is importet like other components they are working fine. In the same time i get a [Vue warn]: Unknown custom element: <emailResults> - did you register the component correctly? For recursive components, make sure to provide the "name" option. but name is declared. I am confused.
– blitze299
Jan 3 at 12:25
You have to pass name of the component here emailResults } from ../components;
– Harsh Patel
Jan 3 at 12:35
I tried this with the export default { name: '}
– blitze299
Jan 3 at 13:04
add a comment |
One component on my vue site isn`t rendered correctly. It is registered like a lot of other components, they are working fine. But when i call only appears in the DOM. Why is this component behaving so strangely?
/index.vue
<template>
<emailResults></emailResults>
</template>
<script>
import { emailResults } from ../components;
export default {
components: {
emailResults
}
};
</script>
/emailResults.vue
<template>
...
</template>
<script>
export default {
name: 'emailResults',
}
</script>
/index.js
import emailResults from './emailResults'
export{
emailResults
}
vue.js vue-component
One component on my vue site isn`t rendered correctly. It is registered like a lot of other components, they are working fine. But when i call only appears in the DOM. Why is this component behaving so strangely?
/index.vue
<template>
<emailResults></emailResults>
</template>
<script>
import { emailResults } from ../components;
export default {
components: {
emailResults
}
};
</script>
/emailResults.vue
<template>
...
</template>
<script>
export default {
name: 'emailResults',
}
</script>
/index.js
import emailResults from './emailResults'
export{
emailResults
}
vue.js vue-component
vue.js vue-component
edited Jan 3 at 14:52
vahdet
2,17841636
2,17841636
asked Jan 3 at 11:42
blitze299blitze299
32
32
Can you explain more because I didn't get what you're asking
– Harsh Patel
Jan 3 at 12:22
Ok so the component isn´t rendered corretly but is importet like other components they are working fine. In the same time i get a [Vue warn]: Unknown custom element: <emailResults> - did you register the component correctly? For recursive components, make sure to provide the "name" option. but name is declared. I am confused.
– blitze299
Jan 3 at 12:25
You have to pass name of the component here emailResults } from ../components;
– Harsh Patel
Jan 3 at 12:35
I tried this with the export default { name: '}
– blitze299
Jan 3 at 13:04
add a comment |
Can you explain more because I didn't get what you're asking
– Harsh Patel
Jan 3 at 12:22
Ok so the component isn´t rendered corretly but is importet like other components they are working fine. In the same time i get a [Vue warn]: Unknown custom element: <emailResults> - did you register the component correctly? For recursive components, make sure to provide the "name" option. but name is declared. I am confused.
– blitze299
Jan 3 at 12:25
You have to pass name of the component here emailResults } from ../components;
– Harsh Patel
Jan 3 at 12:35
I tried this with the export default { name: '}
– blitze299
Jan 3 at 13:04
Can you explain more because I didn't get what you're asking
– Harsh Patel
Jan 3 at 12:22
Can you explain more because I didn't get what you're asking
– Harsh Patel
Jan 3 at 12:22
Ok so the component isn´t rendered corretly but is importet like other components they are working fine. In the same time i get a [Vue warn]: Unknown custom element: <emailResults> - did you register the component correctly? For recursive components, make sure to provide the "name" option. but name is declared. I am confused.
– blitze299
Jan 3 at 12:25
Ok so the component isn´t rendered corretly but is importet like other components they are working fine. In the same time i get a [Vue warn]: Unknown custom element: <emailResults> - did you register the component correctly? For recursive components, make sure to provide the "name" option. but name is declared. I am confused.
– blitze299
Jan 3 at 12:25
You have to pass name of the component here emailResults } from ../components;
– Harsh Patel
Jan 3 at 12:35
You have to pass name of the component here emailResults } from ../components;
– Harsh Patel
Jan 3 at 12:35
I tried this with the export default { name: '}
– blitze299
Jan 3 at 13:04
I tried this with the export default { name: '}
– blitze299
Jan 3 at 13:04
add a comment |
1 Answer
1
active
oldest
votes
You have an index.vue and index.js file. Depeding on your bundler's setup, it might try to import from the wrong file here:
import {
emailResults
} from ../components;
Try being explicit:
import {
emailResults
} from ../components/index.js;
Thanks for your answer. I also just noticed that Vue generated this error even though the name is set.
– blitze299
Jan 3 at 12:58
[Vue warn]: Unknown custom element: <emailResults> - did you register the component correctly? For recursive components, make sure to provide the "name" option.
– blitze299
Jan 3 at 12:58
Yeah this error comes up because you did not register the component, likely because the import statement producedundefined
because of what I described.
– Linus Borg
Jan 3 at 14:42
Ok thanks but in my opinion the index.js imports the component and the index.vue is only the starting point of the app which uses the components.
– blitze299
Jan 3 at 15:38
Well, console.logemailResults
in your index.vue file and see what you get.
– Linus Borg
Jan 4 at 9:15
add a comment |
Your Answer
StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");
StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});
function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});
}
});
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f54021597%2fvue-component-only-shows-up-as-componentname-tag-and-didnt-gets-rendered%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
1 Answer
1
active
oldest
votes
1 Answer
1
active
oldest
votes
active
oldest
votes
active
oldest
votes
You have an index.vue and index.js file. Depeding on your bundler's setup, it might try to import from the wrong file here:
import {
emailResults
} from ../components;
Try being explicit:
import {
emailResults
} from ../components/index.js;
Thanks for your answer. I also just noticed that Vue generated this error even though the name is set.
– blitze299
Jan 3 at 12:58
[Vue warn]: Unknown custom element: <emailResults> - did you register the component correctly? For recursive components, make sure to provide the "name" option.
– blitze299
Jan 3 at 12:58
Yeah this error comes up because you did not register the component, likely because the import statement producedundefined
because of what I described.
– Linus Borg
Jan 3 at 14:42
Ok thanks but in my opinion the index.js imports the component and the index.vue is only the starting point of the app which uses the components.
– blitze299
Jan 3 at 15:38
Well, console.logemailResults
in your index.vue file and see what you get.
– Linus Borg
Jan 4 at 9:15
add a comment |
You have an index.vue and index.js file. Depeding on your bundler's setup, it might try to import from the wrong file here:
import {
emailResults
} from ../components;
Try being explicit:
import {
emailResults
} from ../components/index.js;
Thanks for your answer. I also just noticed that Vue generated this error even though the name is set.
– blitze299
Jan 3 at 12:58
[Vue warn]: Unknown custom element: <emailResults> - did you register the component correctly? For recursive components, make sure to provide the "name" option.
– blitze299
Jan 3 at 12:58
Yeah this error comes up because you did not register the component, likely because the import statement producedundefined
because of what I described.
– Linus Borg
Jan 3 at 14:42
Ok thanks but in my opinion the index.js imports the component and the index.vue is only the starting point of the app which uses the components.
– blitze299
Jan 3 at 15:38
Well, console.logemailResults
in your index.vue file and see what you get.
– Linus Borg
Jan 4 at 9:15
add a comment |
You have an index.vue and index.js file. Depeding on your bundler's setup, it might try to import from the wrong file here:
import {
emailResults
} from ../components;
Try being explicit:
import {
emailResults
} from ../components/index.js;
You have an index.vue and index.js file. Depeding on your bundler's setup, it might try to import from the wrong file here:
import {
emailResults
} from ../components;
Try being explicit:
import {
emailResults
} from ../components/index.js;
answered Jan 3 at 12:41
Linus BorgLinus Borg
12k13839
12k13839
Thanks for your answer. I also just noticed that Vue generated this error even though the name is set.
– blitze299
Jan 3 at 12:58
[Vue warn]: Unknown custom element: <emailResults> - did you register the component correctly? For recursive components, make sure to provide the "name" option.
– blitze299
Jan 3 at 12:58
Yeah this error comes up because you did not register the component, likely because the import statement producedundefined
because of what I described.
– Linus Borg
Jan 3 at 14:42
Ok thanks but in my opinion the index.js imports the component and the index.vue is only the starting point of the app which uses the components.
– blitze299
Jan 3 at 15:38
Well, console.logemailResults
in your index.vue file and see what you get.
– Linus Borg
Jan 4 at 9:15
add a comment |
Thanks for your answer. I also just noticed that Vue generated this error even though the name is set.
– blitze299
Jan 3 at 12:58
[Vue warn]: Unknown custom element: <emailResults> - did you register the component correctly? For recursive components, make sure to provide the "name" option.
– blitze299
Jan 3 at 12:58
Yeah this error comes up because you did not register the component, likely because the import statement producedundefined
because of what I described.
– Linus Borg
Jan 3 at 14:42
Ok thanks but in my opinion the index.js imports the component and the index.vue is only the starting point of the app which uses the components.
– blitze299
Jan 3 at 15:38
Well, console.logemailResults
in your index.vue file and see what you get.
– Linus Borg
Jan 4 at 9:15
Thanks for your answer. I also just noticed that Vue generated this error even though the name is set.
– blitze299
Jan 3 at 12:58
Thanks for your answer. I also just noticed that Vue generated this error even though the name is set.
– blitze299
Jan 3 at 12:58
[Vue warn]: Unknown custom element: <emailResults> - did you register the component correctly? For recursive components, make sure to provide the "name" option.
– blitze299
Jan 3 at 12:58
[Vue warn]: Unknown custom element: <emailResults> - did you register the component correctly? For recursive components, make sure to provide the "name" option.
– blitze299
Jan 3 at 12:58
Yeah this error comes up because you did not register the component, likely because the import statement produced
undefined
because of what I described.– Linus Borg
Jan 3 at 14:42
Yeah this error comes up because you did not register the component, likely because the import statement produced
undefined
because of what I described.– Linus Borg
Jan 3 at 14:42
Ok thanks but in my opinion the index.js imports the component and the index.vue is only the starting point of the app which uses the components.
– blitze299
Jan 3 at 15:38
Ok thanks but in my opinion the index.js imports the component and the index.vue is only the starting point of the app which uses the components.
– blitze299
Jan 3 at 15:38
Well, console.log
emailResults
in your index.vue file and see what you get.– Linus Borg
Jan 4 at 9:15
Well, console.log
emailResults
in your index.vue file and see what you get.– Linus Borg
Jan 4 at 9:15
add a comment |
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f54021597%2fvue-component-only-shows-up-as-componentname-tag-and-didnt-gets-rendered%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Can you explain more because I didn't get what you're asking
– Harsh Patel
Jan 3 at 12:22
Ok so the component isn´t rendered corretly but is importet like other components they are working fine. In the same time i get a [Vue warn]: Unknown custom element: <emailResults> - did you register the component correctly? For recursive components, make sure to provide the "name" option. but name is declared. I am confused.
– blitze299
Jan 3 at 12:25
You have to pass name of the component here emailResults } from ../components;
– Harsh Patel
Jan 3 at 12:35
I tried this with the export default { name: '}
– blitze299
Jan 3 at 13:04