For the complete code, click here: https://github.com/vscodr/axios_issue
After spending some time away from JavaScript working in Python, I decided to come back and try to tackle similar tasks using JS. However, I seem to be stuck at a very basic issue! Despite having Axios installed as a dependency,
"dependencies": {
"axios": "^0.19.2"
}
I'm facing an issue when trying to use axios from the first line of my script:
import axios from 'axios'
r = axios.get('https://swapi.dev')
console.log(r)
Every time I run this, I get the error message:
Uncaught SyntaxError: import declarations may only appear at top level of a module
Despite trying various ways of calling the script like:
<script type="module" src="/main.js"></script>
<script type="module" src="main.js"></script>
<script type="module" src="./main.js"></script>
Which leads to:
Uncaught TypeError: Error resolving module specifier: axios main.js:1:18
And also trying:
<script src="./main.js"></script>
<script src="/main.js"></script>
<script src="main.js"></script>
Resulting in:
Uncaught SyntaxError: import declarations may only appear at top level of a module :1:18
Even after referring to relevant documentation such as:
https://developer.mozilla.org/en-US/docs/Web/HTML/Element/script
and trying code directly from the documentation without success, I find myself stuck on this issue.
axios.get('https://swapi.dev')
.then(function (response) {
// handle success
console.log(response);
})
.catch(function (error) {
// handle error
console.log(error);
})
.finally(function () {
// always executed
});
This seems like an elementary mistake that I am struggling with. The browser error messages are not providing much insight. I suspect it could be related to WEBPACK.
There might be some new changes or updates that have eluded me. This simple problem is frustrating me, and I am seeking help to resolve it.
Currently using a fresh install of Windows and VSCode on a new machine.