There are 2 projects generated by vue-cli.
one of it I could add component like this code below:
Vue.component('HeaderBar',require("./components/common/HeaderBar.vue"));
But another one I can't do this , I must code like this:
Vue.component('HeaderBar',require("./components/common/HeaderBar.vue").default);
if not, I will get this error message:
Failed to mount component: template or render function not defined
Is anyone could tell me Why like this ?
Thank you for help .
What are props? In Vue, props (or properties), are the way that we pass data from a parent component down to it's child components. When we build our applications out of components, we end up building a data structure called a tree.
To specify the type of prop you want to use in Vue, you will use an object instead of an array. You'll use the name of the property as the key of each property, and the type as the value. If the type of the data passed does not match the prop type, Vue sends an alert (in development mode) in the console with a warning.
📖 Rule Details. This rule require component names to be always multi-word, except for root App components, and built-in components provided by Vue, such as <transition> or <component> . This prevents conflicts with existing and future HTML elements, since all HTML elements are a single word.
Using export default: You can use export-default for creating local registration for the Vue component.
When using ES6 imports (export default HeaderBar), the exported module is of the format {"default" : HeaderBar}. The import statement handles this assignment for you, however, you have to do the require("./mycomponent").default conversion yourself. The HMR interface code cannot use import as it doesn't work inline.
If you want to avoid that, use module.exports instead of export default.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With