Home  >  Q&A  >  body text

Encountered component import error when using Vue-cal

<p>Install <code>npm i vue-cal</code></p> <p>In my js file:</p> <p><code>Import VueCal</p> from 'vue-cal'</code> <p>I get this message in the console: <code>Unable to resolve module specifier 'vue-cal'</code></p>
P粉790187507P粉790187507415 days ago479

reply all(1)I'll reply

  • P粉561438407

    P粉5614384072023-09-01 13:32:13

    Related to Doc, Vue Cal is a component, so you have to use it like a component.

    You have to do something like this:

    import VueCal from 'vue-cal'
    import 'vue-cal/dist/vuecal.css'
    
    export default {
      components: { VueCal },
      ...
    }
    

    Documentationhttps://antoniandre.github.io/vue-cal/< /p>

    Still getting errors?

    You can remove the import above and use the script in the documentation related to the section above or via the tag .

    In the head tag of the file index.html:

    <head>
      ...
      <script src="https://unpkg.com/vue@legacy"></script>
      <script src="https://unpkg.com/vue-cal@legacy"></script>
      <link href="https://unpkg.com/vue-cal@legacy/dist/vuecal.css" rel="stylesheet">
    </head>
    

    Now that Vue cal is fully available in your vue application, you just need to go into your component and do the following:

    export default {
      components: { VueCal: vuecal },
    }
    

    reply
    0
  • Cancelreply