question-mark
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.

ES6 import Mark from file not working

See original GitHub issue

Describe the bug I’m using the pure javascript ES6 file. The script below is a module added by script[type=module].

import { Mark } from '../import/mark.es6.js';

console.log(Mark);

Result: Uncaught SyntaxError: import not found: Mark.

I have also tried to import for side effects:

import '../import/mark.es6.js';

console.log(Mark);

Result: Uncaught TypeError: global is undefined

To Reproduce Steps to reproduce the behavior:

  1. Download the dist/ archive and copy the mark.es6.js file somewhere in the project directory (e.g. /js/import/mark.es6.js)
  2. Create a new JS file (e.g. /js/example.js) and add it as a module to the html page via script[type=module]
  3. Edit example.js and import Mark from it: import { Mark } from './import/mark.es6.js';
  4. Load the page on your browser and check the console for errors.

My workaround Put Mark in the global scope by adding it like this:

<script defer src="/js/import/mark.es6.js"></script>

Browser Firefox 90.0.2

Issue Analytics

  • State:closed
  • Created 2 years ago
  • Comments:12 (1 by maintainers)

github_iconTop GitHub Comments

2reactions
kaseyhintoncommented, Nov 22, 2021

I am also running into the same problem. For ecmascript imports to work you need to provide something that looks like this

default export

export default Mark;

default import

import Mark from 'mark.js/dist/mark.es6.js';'

export

export const Mark;

import

import { Mark } from 'mark.js/dist/mark.es6.js';'
1reaction
dabrahamscommented, Jan 7, 2022

@kaseyhinton if you know what to do, I suggest submitting a PR

Read more comments on GitHub >

github_iconTop Results From Across the Web

Mark file imported by the main file in an ES6 Node.JS project ...
Here is the code that imports the problem file (FBXLoader.js), with the createRequire alchemy statements shown:
Read more >
TypeScript ES6 import module File is not a module error
I am using TypeScript 1.6 with ES6 modules syntax. My files are: test.ts: module App { export class SomeClass { getName(): string {...
Read more >
16. Modules - Exploring JS
ES6 is the first time that JavaScript has built-in modules. ES6 modules are stored in files. There is exactly one module per file...
Read more >
JavaScript Import Explained - Tutorials - Yax.com
This article introduces the Javascript import statement, explaining its purpose and how to use it. In particular, I look at how importing modular...
Read more >
JavaScript | IntelliJ IDEA Documentation - JetBrains
IntelliJ IDEA supports running and debugging tests as well as navigation ... Click Open or Import on the Welcome screen or select File...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found