How to use ES6 modules from dev tools console

javascript es6-modules
Timmmm picture Timmmm · Sep 29, 2018 · Viewed 11.7k times · Source

As far as I understand it, if I create an ES6 module, I can only import it from code that is itself a module. This means non-module code, i.e. inline Javascript, or the Chrome dev tools console can never access code that is in a module.

Is that true? Is there any way around this because it seems like a fairly extreme limitation.

Answer

Kin picture Kin · Dec 29, 2018

You can use dynamic import within Chrome's console.

import('path/to/module.js').then(m => module = m)

// [doSomething] is an exported function from [module.js].
module.doSomething()

Related questions

Is it possible to import modules from all files in a directory, using a wildcard?

With ES6, I can import several exports from a file like this: import {ThingA, ThingB, ThingC} from 'lib/things'; However, I like the organization of having one module per file. I end up with imports like this: import ThingA from …

Read More
How can I alias a default import in JavaScript?

Using ES6 modules, I know I can alias a named import: import { foo as bar } from 'my-module'; And I know I can import a default import: import defaultMember from 'my-module'; I'd like to alias a default import and I had …

Read More
Using import fs from 'fs'

I want to use import fs from 'fs' in JavaScript. Here is a sample: import fs from 'fs' var output = fs.readFileSync('someData.txt') console.log(output) The error I get when I run my file using node main.js …

Read More