"Uncaught SyntaxError: Cannot use import statement outside a module" - What does it mean?

Question

Im starting to learn React through Scrimba, but what the tutor is doing on the screen Im not able to replicate. Ive install npm and have installed react and react-dom, but am getting the error. My code is below:

import React from 'react'
import ReactDOM from 'react-dom'

function Name(){
    return (
        <p>This is me...</p>
    )
}

ReactDOM.render(<Name />, document.getElementById('root'))

And the package.json is as follows:

{
  "name": "test",
  "version": "1.0.0",
  "description": "",
  "main": "app.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1",
    "start": "nodemon app"
  },
  "author": "",
  "license": "ISC",
  "devDependencies": {
    "nodemon": "^2.0.2",
    "react": "^16.12.0",
    "react-dom": "^16.12.0"
  },
  "dependencies": {
    "body-parser": "^1.19.0",
    "express": "^4.17.1",
    "express-session": "^1.17.0",
    "mysql": "^2.18.1",
    "path": "^0.12.7"
  }
}

If anyone knows what Im doing wrong Id really appreciate it, and would really like to know how to fix this

Answer 1

You are using es6 features and also jsx while you haven't requirements to run the code. You have to install and config the webpack and babel transpiler.