html page
<!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">
<title>Document</title>
</head>
<body>
<div id="root"></div>
<script type="module" src="./index.js"></script>
</body>
</html>
jsx page
import React from "react"
import ReactDOM from "react-dom"
ReactDOM.render(<h1>Hello</h1>, document.getElementById("root"))
I get this error when I write a simple react code. Why am I getting this error?
Related
What is the problem in not communicating with Binance WebSocket in the following codes?
file index.html:
<!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">
<title>Stock</title>
</head>
<body>
<script src="app.js"></script>
</body>
</html>
file app.js:
let ws = new WebSocket('wss://stream.binance.com:9443/ws/etheur#trade');
ws.onmessage = (event) => {
console.log(event.data);
};
The error I encounter in the console part of the browser.
How to solve this error?
I want to use EditorJS in my project. So I have created an HTML file after reading the documentation. Here is the file called index.html:
<!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">
<title>Home</title>
</head>
<body>
<div id="editorjs"></div>
<script src="https://cdn.jsdelivr.net/npm/#editorjs/editorjs#latest"></script>
<script>
import EditorJS from '#editorjs/editorjs'
const editor = new EditorJS('editorjs')
</script>
</body>
</html>
After opening the file into the browser, EditorJS is not showing up and this message is printed in the console- Uncaught SyntaxError: Cannot use import statement outside a module.
How to fix this problem?
<!DOCTYPE html>
<html lang="en">
<head>
<script src="https://cdn.jsdelivr.net/npm/#editorjs/editorjs#latest"></script>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Home</title>
</head>
<body>
<div id="editorjs"></div>
<script>
const editor = new EditorJS({
autofocus: true
});
</script>
</body>
</html>
When you add a script tag in your HTML file, you don't need to import the library again you can just start using it!
The script isn't a type module, use:
<script type="module">
import _ from 'lodash';
<!-- begin snippet: js hide: false console: true babel: false -->
<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="style.css">
<script src="https://cdn.jsdelivr.net/npm/lodash#4.17.21/lodash.js" ></script>
<script type="module" src="./script.js" defer></script>
<title>Quiz</title>
</head>
I get this error code in the console whenever I try to import lodash and my whole program stops working.
Uncaught SyntaxError: Cannot use import statement outside a module
This is my html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<div id="root"></div>
<script src="index.js"></script>
</body>
</html>
```
Javascript
import React from "react"
import ReactDOM from "react-dom"
ReactDOM.render(
<h1>Hello, world!</h1>,
document.getElementById('root')
);
The problem is that there are no problems and nothing shows up on the output as wrong. I made sure to save my code and rebooted VS code a bunch of times. I installed all the libraries and was following a tutorial. Then for some reason it isn't working.
The errors appear at the console after i open this code on live server on vscode, im learning Vue.js and the code itself opens the file but i dont know how to fix those errors.
Ive reasearched somethings about the errors but couldnt fix them.`
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<script src="./vuejs"></script>
<title>Document</title>
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
</head>
<body>
<p>teste</p>
<script>
const vm = new Vue();
console.log(vm)
</script>
</body>
</html>`