VueJs - Failed to resolve module specifier axios.


Axios and VueJS are often paired together, you might have received the following error if you have inlined a VueJS app outside of the full CLI pipeline.

Uncaught TypeError: Failed to resolve module specifier "axios".

Most examples built for the CLI will show an import to axios at the top of the file something like this:

import axios from 'axios';

The above error though is still deceptive because in cases where we've included the library like below we will receive an error with the relative import. Instead of providing a relative import we can simply remove the import axios line all together.

Here is a more complete example of the JavaScript to download a json array.

<script src="https://unpkg.com/vue@2.6.14"></script>
<script src="https://unpkg.com/axios@0.2.1/dist/axios.min.js"></script>
<script type="module">
    var app = new Vue({
      el: '#app',
      data: {
        logEntries: []
      },
      created: function () {
          this.logEntries = axios.get('/content?Handler=ContentIndex').then((response) => {
              this.logEntries = response;
          });
      }
    })
</script>

Leave a comment

Please note that we won't show your email to others, or use it for sending unwanted emails. We will only use it to render your Gravatar image and to validate you as a real person.