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?
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.
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.
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.
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.
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.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With