Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Getting syntax error (Unexpected token 'export')

See original GitHub issue

I imported React Syntax Highlighter in my next.js project import { Prism as SyntaxHighlighter } from 'react-syntax-highlighter'; import { dracula } from 'react-syntax-highlighter/dist/esm/styles/prism'

and got this error in my console

`index.js?46cb:352

   Uncaught     at <unknown> (file://D:\Nextjs Projects\portfolio\node_modules\react-syntax-highlighter\dist\esm\styles\prism\index.js:1)
at Object.compileFunction (node:vm:352:18)
at wrapSafe (node:internal/modules/cjs/loader:1031:15)
at Module._compile (node:internal/modules/cjs/loader:1065:27)
at Object.Module._extensions..js (node:internal/modules/cjs/loader:1153:10)
at Module.load (node:internal/modules/cjs/loader:981:32)
at Function.Module._load (node:internal/modules/cjs/loader:822:12)
at Module.require (node:internal/modules/cjs/loader:1005:19)
at require (node:internal/modules/cjs/helpers:102:18)
at Object.react-syntax-highlighter/dist/esm/styles/prism (file://D:\Nextjs Projects\portfolio\.next\server\pages\blogs\[slug].js:186:18)
at __webpack_require__ (file://D:\Nextjs Projects\portfolio\.next\server\webpack-runtime.js:33:42)`

Issue Analytics

State:
Created a year ago
Comments:10

Top GitHub Comments

29reactions

B3ntencommented, Jun 1, 2022

Seems like the fix is to use

import { dracula } from 'react-syntax-highlighter/dist/cjs/styles/prism

Instead of ‘esm’

0reactions

Adarsh-kushwahacommented, Nov 9, 2022

Thanks a lot @B3nten

Top Results From Across the Web

Getting Unexpected Token Export - javascript

When you include the script like this: <script src="module.js"></script>. You will get the error: Uncaught SyntaxError: Unexpected token export.

How to fix SyntaxError: Unexpected token 'export' in ...

In this article, we are going to see How to fix SyntaxError: Unexpected token 'export' in JavaScript? and what are Es6 modules.

How to Fix „Uncaught SyntaxError: Unexpected token 'export

Using type="module" on the <script> tag solved the „Unexpected token export ” error. The browser runs the imported JavaScript without issues.

Unexpected Token Export: A Comprehensive Guide

To resolve the uncaught syntaxError unexpected token 'export' error, the programmer has to change the type property to “module” in their package.json file....

How to Solve Unexpected Token 'export' Error in JavaScript

To solve the "Uncaught SyntaxError Unexpected token 'export'" error, set the type property to module in your package.json file.