0

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
niCC_S
  • 11
  • 1
  • when using `type="module"` u need to import the script with the es6 import syntax. try to remove it. or try using `window.Ably.Realtime(...)` – Sysix May 01 '22 at 01:56
  • Read about import from MDN docs : https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/import – Houssem Salem May 01 '22 at 01:59
  • I put 'import * as Ably from "ably";' at the top of my js file, which made my js file properly recognize Ably. However, my browser throws `Uncaught TypeError: Failed to resolve module specifier "ably". Relative references must start with either "/", "./", or "../".`. When I replace "ably" with a relative reference it throws a 404 error. Any ideas? – niCC_S May 01 '22 at 03:42

0 Answers0