Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

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 thought the following would work:

import defaultMember as alias from 'my-module'; 

But that results in a parsing (syntax) error.

How can I (or can I?) alias a default import?

like image 429
sfletche Avatar asked Sep 01 '16 23:09

sfletche


People also ask

What is an import alias?

Import aliases are where you take your standard import, but instead of using a pre-defined name by the exporting module, you use a name that is defined in the importing module.

How do I rename an import in typescript?

To import two classes with the same name, use the as keyword to rename one or both of the imports, e.g. import { Employee as Employee2 } from './another-file-2'; . The as keyword allows us to change the identifying name of the import.

How do I rename an import React?

To use import aliases when importing components in React, use the as keyword to rename the imported component, e.g. import {Button as MyButton} from './another-file' . The as keyword allows us to change the identifying name of the import.

What is dynamic import in JavaScript?

Dynamic imports or Code Splitting is the practice of breaking up your JavaScript modules into smaller bundles and loading them dynamically at runtime to improve and increase the performance of your website dramatically.


1 Answers

defaultMember already is an alias - it doesn't need to be the name of the exported function/thing. Just do

import alias from 'my-module'; 

Alternatively you can do

import {default as alias} from 'my-module'; 

but that's rather esoteric.

like image 176
Bergi Avatar answered Sep 29 '22 00:09

Bergi