Be part of JetBrains PHPverse 2026 on June 9 – a free online event bringing PHP devs worldwide together.

shahr's avatar
Level 10

ReferenceError: axios is not defined

I want to import axios.post in the watch?

watch: {
    date(newDate) {
        const showType = document.getElementById('showType');
        showType.textContent = newDate;
        axios.post('{{ route('product.warranty.save') }}', {
            date: newDate,
            product_id: this.product_id,
            warranty_id: this.warranty_id,
        })
            .then(response => {
                this.dates.push(response.data.date);
                this.products.push(response.data.product_id);
                this.warranties.push(response.data.warranty_id);
            })
            .catch(error => {
                console.log('Error:', error);
            });
    },
},

ReferenceError: axios is not defined

0 likes
2 replies
LaryAI's avatar
Level 58

The error message "ReferenceError: axios is not defined" means that the axios library is not available in the current scope. To fix this, you need to import the axios library before using it in the watch method.

To import axios, you can add the following line at the top of your script:

import axios from 'axios';

This will import the axios library and make it available in the current scope. Here's the updated code:

import axios from 'axios';

watch: {
    date(newDate) {
        const showType = document.getElementById('showType');
        showType.textContent = newDate;
        axios.post('{{ route('product.warranty.save') }}', {
            date: newDate,
            product_id: this.product_id,
            warranty_id: this.warranty_id,
        })
            .then(response => {
                this.dates.push(response.data.date);
                this.products.push(response.data.product_id);
                this.warranties.push(response.data.warranty_id);
            })
            .catch(error => {
                console.log('Error:', error);
            });
    },
},

Make sure to install axios using npm or yarn before importing it:

npm install axios
# or
yarn add axios
1 like
AddWebContribution's avatar

@waves you have not installed axios package due to you are geeting that error

npm install axios

and if you still find it delete the package.lock file and

npm install
1 like

Please or to participate in this conversation.