title: Personal Vue 3 component package missing template or render function
body: <p>I recently uploaded my own Vue 3 component to NPM to make it usable for others. When using it in other projects it gives this warning:</p>
  <pre><code>[Vue warn]: Component is missing template or render function. 
  at &lt;VueToggle id=&quot;1&quot; title=&quot;Toggle me&quot; &gt; 
  at &lt;App&gt;
  </code></pre>
  <p>What could be the reason this is happening? The way I am building and publishing the app is by running this code.</p>
  <pre><code>import VueToggle from &quot;./components/VueToggle&quot;;
  
  export default {
      install(app) {
          app.component(&quot;vue-toggle&quot;, VueToggle);
      }
  };
  
  </code></pre>
  <p>And then running this build command in my package.json:</p>
  <pre><code>&quot;build-library&quot;: &quot;vue-cli-service build --target lib --name vue-toggle-component ./src/install.js&quot;,
  </code></pre>
  <p>How I use my component in a different project:</p>
  <pre><code>&lt;template&gt;
    &lt;VueToggle id=&quot;1&quot; title=&quot;Toggle me&quot;/&gt;
  &lt;/template&gt;
  
  &lt;script&gt;
  import VueToggle from 'vue-toggle-component';
  
  export default {
    name: 'App',
    components: {
      VueToggle,
    }
  }
  &lt;/script&gt;
  </code></pre>
  <p>The component itself:</p>
  <pre><code>&lt;template&gt;
    &lt;section class=&quot;wrapper&quot; :class=&quot;{dark: darkTheme}&quot; :title=&quot;title&quot;&gt;
      &lt;input
        :id=&quot;id&quot;
        :name=&quot;name&quot;
        v-model=&quot;toggleState&quot;
        class=&quot;toggle&quot;
        type=&quot;checkbox&quot;
        @click=&quot;toggleState = !toggleState&quot;
      /&gt;
      &lt;label :for=&quot;id&quot; class=&quot;toggler&quot; :style=&quot;[toggleState &amp;&amp; {'background': activeColor}]&quot;/&gt;
      &lt;span class=&quot;title&quot; v-text=&quot;title&quot; @click=&quot;toggleState = !toggleState&quot;/&gt;
    &lt;/section&gt;
  &lt;/template&gt;
  
  &lt;script&gt;
  export default {
    name: 'VueToggle',
    props: {
      activeColor: {type: String, default: '#9FD6AE'},
      darkTheme: {type: Boolean, default: false},
      id: {type: String, required: true},
      name: {type: [String, Boolean], default: false},
      title: {type: String, required: true},
      toggled: {type: Boolean, default: false},
    },
    data() {
      return {
        toggleState: this.toggled
      }
    },
  }
  &lt;/script&gt;
  </code></pre>
  <p>The package: <a href="https://www.npmjs.com/package/vue-toggle-component" rel="nofollow noreferrer">https://www.npmjs.com/package/vue-toggle-component</a></p>