What is causing the 'axios is not a function' error in my Axios post request implementation?

Question

Attempting to send a post request to the DVLA EPS Api using Axios. Both methods I used returned errors.

I first tried how I thought the request should go, then copied the example from the documentation, both didn't work with two different errors.

My codes error: Access to XMLHttpRequest at 'https://uat.driver-vehicle-licensing.api.gov.uk/vehicle-enquiry/v1/vehicles' from origin 'http://localhost:3000' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource.

Documentation example error: Uncaught TypeError: axios is not a function

My code:

import './App.css';
import axios from 'axios';

function App() {
  var target = JSON.stringify({ registrationNumber: 'AA19AAA' });
  const api_url = "https://uat.driver-vehicle-licensing.api.gov.uk/vehicle-enquiry/v1/vehicles";

  function getData() {
    axios.post(api_url, {
      headers: {
        'x-api-key': 'API KEY HERE',
        'Content-Type': 'application/json',
      },
      data: target
    })
      .then(res => {
        console.log(res.data.content);
      })
      .catch(err => {
        console.log(err);
      })
  }

  return (
    <div className="App">
      <button onClick={getData}>Get Info</button>
    </div>
  );
}

export default App;

Documentation example:

import './App.css';
import axios from 'axios';

function App() {
    var axios = require('axios');

    var data = JSON.stringify({ registrationNumber: 'AA19AAA' });
    
    var config = {
      method: 'post',
      url:
        'https://uat.driver-vehicle-licensing.api.gov.uk/vehicle-enquiry/v1/vehicles',
      headers: {
        'x-api-key': 'API KEY HERE',
        'Content-Type': 'application/json',
      },
      data: data,
    };
    
    axios(config)
      .then(function(response) {
        console.log(JSON.stringify(response.data));
      })
      .catch(function(error) {
        console.log(error);
      });
    
  return (
    <div className="App">
    </div>
  );
}

export default App;

Im completely new to this, any help would be appreciated.