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.

Support dynamic import

See original GitHub issue

Input

The code looked like this before beautification:

frontend = Async(() => import('../frontend').then(m => m.default      ))

Expected Output

The code should have looked like this after beautification:

frontend = Async(() => import('../frontend').then(m => m.default))

Actual Output

The code actually looked like this after beautification:

frontend = Async(() =>
        import('../frontend').then(m => m.default))

Environment

OS: Linux 4.10, node 7.10

Settings

Example:

{
    "brace_style": "collapse,preserve-inline",
    "break_chained_methods": false,
    "end_with_newline": false,
    "eol": "\n",
    "e4x": true,
    "eval_code": false,
    "indent_char": " ",
    "indent_level": 0,
    "indent_with_tabs": false,
    "jslint_happy": false,
    "keep_array_indentation": false,
    "keep_function_indentation": false,
    "max_preserve_newlines": 2,
    "preserve_newlines": true,
    "selector_separator_newline": false,
    "space_after_anon_function": false,
    "space_before_conditional": true,
    "unescape_strings": false,
    "wrap_attributes": "auto",
    "wrap_attributes_indent_size": 4,
    "wrap_line_length": 0,
    "indent_size": 4
}

TC39 Proposal

Issue Analytics

State:
Created 6 years ago
Reactions:2
Comments:14 (7 by maintainers)

Top GitHub Comments

1reaction

bitwisemancommented, Aug 13, 2018

@ZzZombo
Are you joking or not? I can’t tell. The input is valid, that output is also valid and has the same meaning as the input. How is that wrong?

1reaction

bitwisemancommented, Aug 13, 2018

Note, in the original input there is a space. It is preserved in the output in rc6, exactly as you had above.

In rc6 if you pass:

frontend = Async(() => import('../frontend').then(m => m.default))

You get:

frontend = Async(() =>
    import('../frontend').then(m => m.default))

Which is also valid.

Top Results From Across the Web

JavaScript modules: dynamic import() - CanIUse

"Can I use" provides up-to-date browser support tables for support of front-end web ... Loading JavaScript modules dynamically using the import() syntax.

Advanced Features: Dynamic Import - Next.js

Dynamically import JavaScript modules and React Components and split your code ... Next.js supports lazy loading external libraries with import() and React ...

import() - JavaScript - MDN Web Docs - Mozilla

The import() syntax, commonly called dynamic import, is a function-like expression that allows loading an ECMAScript module asynchronously ...

How to Dynamically Import ECMAScript Modules

You can import modules dynamically if you use import as a function — import(pathToModule) — a feature available starting ES2020.

Dynamic imports - The Modern JavaScript Tutorial

Dynamic imports. Export and import statements that we covered in previous chapters are called “static”. The syntax is very simple and strict ...