close

[Solved] Uncaught SyntaxError: Cannot use import statement outside a module

Hello Guys, How are you all? Hope You all Are Fine. Today I am adding milsymbol.js to the script, the console returns the following error Uncaught SyntaxError: Cannot use import statement outside a module in Javascript. So Here I am Explaining to you all the possible solutions here.

Without wasting your time, Let’s start This Article to Solve This Error.

How Uncaught SyntaxError: Cannot use import statement outside a module Error Occurs ?

Today I am adding milsymbol.js to the script, the console returns the following error

Uncaught SyntaxError: Cannot use import statement outside a module

How To Solve Uncaught SyntaxError: Cannot use import statement outside a module Error ?

  1. How To Solve Uncaught SyntaxError: Cannot use import statement outside a module Error?

    To Solve Uncaught SyntaxError: Cannot use import statement outside a module Error Just add type=”module” inside the script tag as given below. if you get ReferenceError: require is not defined, you'll need to use the import syntax instead of requiring. You can't natively mix and match between them, so you'll need to pick one or use a bundler if you need to use both.

  2. Uncaught SyntaxError: Cannot use import statement outside a module

    To Solve Uncaught SyntaxError: Cannot use import statement outside a module Error Just add type=”module” inside the script tag as given below. if you get ReferenceError: require is not defined, you'll need to use the import syntax instead of requiring. You can't natively mix and match between them, so you'll need to pick one or use a bundler if you need to use both.

Solution 1: Just Add type=”module” inside the script tag

To Solve Uncaught SyntaxError: Cannot use import statement outside a module Error You Just Need to add type=”module” inside the script tag as given below.

<script type="module" src="milsymbol-2.0.0/src/milsymbol.js"></script>

And now, Your error will be solved. Thanks.

Solution 2: Add “type”: “module” to your package.json

You can also add “type”: “module” in your package.json Just like this.

{
  "type": "module",
}

Note: If you are using type as Module then you need to use import syntax instead of require syntax Unless you’ll face ReferenceError: require is not defined

Solution 3: changing this line

If You Don’t specify type in script tag just like below then you’ll face above error.

<script src="../src/main.js"></script>

You just need to add type in your script tag just like the below example.

<script type="module" src="../src/main.js"></script>

And now, Your error will be resolved. Thank You.

Solution 4: Use Require instead of import To solve Uncaught SyntaxError: Cannot use import statement outside a module

If You don’t use type as a module then you can use require syntax instead of import syntax.

parse = require('node-html-parser');

And If you are using type as Module then you need to use import syntax instead of require syntax Unless you’ll face ReferenceError: require is not defined Just like this.

import { parse } from 'node-html-parser';

And now, Your error should be solved.

Summary

It’s all About this issue. Hope all solutions helped you a lot. Comment below Your thoughts and your queries. Also, Comment below which solution worked for you.

Also, Read

Leave a Comment