How can I access a variable that is imported on another <script> tag in JS

Question

I was messing around with socket.io and I've encountered to a problem that I couldn't solve for awhile. I have a HTML page that has 2 different scripts imported. One of them is the socket.io import;

<script src="node_modules/socket.io-client/dist/socket.io.js">
    var socket;
    socket = io.connect('http://localhost:8080'); 
</script>

And the other one is a script for that does stuff for the game. I want to call the variable "socket" that was declared in the first imported script, (that is above) in this script. And FYI it's inside of a function just like this;

<script type="text/javascript">
    function myFunc(data) {
        socket.emit('key',data);
    }
</script>

Now if I try to run it like this, it says the "socket" variable is not defined. If I try to use the game script inside the socket.io script, it doesn't work either. And I don't know if there's any way that I could import the socket.io script inside the game script so what should I do?

Answer 1

You can't have a script tag use both a source and have something inside it. Put your socket.io source script in its own script tag and it should work.

EDIT: Like this:

<script src="node_modules/socket.io-client/dist/socket.io.js"></script>
<script>
    var socket;
    socket = io.connect('http://localhost:8080'); 
</script>