How to import JS modules in client sided JS files?

225 views Asked by At

Sorry if the question wording is unclear. When I try to use the Ably module in my client-side js file, the object doesn't exist. I thought that javascript files within the same HTML file all had access to each other, so my client-side JS file would have access to Ably because I specified them both, but it won't function. If I type Ably in the JS file, which should let me access the methods of the Ably module, it does not recognize it and nothing happens(besides not found errors, of course)

Here is the HTML file

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="./css/metronome.css">
    <title>whywontthiswork</title>
    <script lang="text/javascript" src="https://cdn.ably.com/lib/ably.min-1.js"></script>
    <script src="/public/app.js" type="module"></script>
</head>...

Here is the JS code segment that doesnt work because it won't recognize Ably and thinks its random text.

const client = new Ably.Realtime({ 
    key: "(my key)" 
});

Here is my file structure

├── public/
│   ├── app.js
├── views/
│   ├── metronome.html
0

There are 0 answers