Error: SyntaxError: Cannot use import statement outside a module JavaScript

Question

I am trying to import the class Paddle from the paddle.js file but it keeps getting an error of "Error: SyntaxError: Cannot use import statement outside a module". The files are in the same folder.

Here's my import code (from game.js file):

import Paddle from "/paddle.js";
let canvas = document.getElementById("screen");
let ctx = canvas.getContext("2d");

const game_width = 800;
const game_height = 600;

ctx.clearRect(0, 0, 800, 600);

and here's my code from paddle.js:

export default class Paddle {
constructor(gameWidth, gameHeight){

    this.width = 150;
    this.height = 30;

    this.position = {

        x: gameWidth / 2 - this.width / 2,
        y: gameHeight - this.height - 10,

    }
}

draw(ctx){
    ctx.fillRect(this.position.x, this.position.y, this.width, this.height);
}

update(deltaTime){

    if(!deltaTime) return;
    this.position.x += 5 / deltaTime;
}

}

The script element has to be type of module, i.e. set `type="module"` attribute for the script element. — Teemu, Mar 20 '20 at 11:10

Alex · Answer 1 · 2020-03-20T11:10:46.037

-3

try this: import Paddle from "./paddle.js"; u main problem was that u don't put "."

edited Mar 20 '20 at 11:10

answered Mar 20 '20 at 11:09

Alex

193
1
11

The class is being exported as `default`. – Andy Mar 20 '20 at 11:10
Tried that because I was desperate but it doesn't work class is being exported as default. – Brenz Mar 20 '20 at 11:11
@Brenz check edited answer – Alex Mar 20 '20 at 11:12
@Alex its still not working. That really is all there is in my code nothing else. – Brenz Mar 20 '20 at 11:15

Error: SyntaxError: Cannot use import statement outside a module JavaScript

1 Answers1