JavaScriptでデフォルトのインポートにエイリアスを設定するにはどうすればよいですか?


382

ES6モジュールを使用すると、名前付きインポートにエイリアスを付けることができます

import { foo as bar } from 'my-module';

そして、私はデフォルトのインポートをインポートできることを知っています

import defaultMember from 'my-module';

デフォルトのインポートにエイリアスを付けたいのですが、次のようにするとうまくいきました

import defaultMember as alias from 'my-module';

しかし、その結果、構文解析(構文)エラーが発生します。

デフォルトのインポートにエイリアスを設定するにはどうすればよいですか?

回答:


725

defaultMemberすでにある別名-それは、エクスポートされた関数/ものの名前である必要はありません。するだけ

import alias from 'my-module';

あるいは、あなたは行うことができます

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

しかし、それはかなり難解です。


12
エイリアス自体は難解です!名前のエクスポートをインポートし、 Reduxのコンポーネントをテストするときのデフォルトは便利です:import WrappedComponent, { Component } from 'my-module';
PTIM

一部の非常に厳密なストリニングルールは同意せず、実際にはデフォルト入力の名前をファイル名として保持することを求めています
phil294

1
@Blauhirnこれは、参照を追跡できず、リファクタリングツールにグローバルな検索と置換を使用する必要がある古いIDEの場合ですか?ばかげている。
Bergi、

@Bergiいいえ、これはtslintルール「import-name」であり、たとえばairbnb tslintルールセットによって使用されているため、かなり広く使用されています。これらのルールは、一貫した、バグのない、読みやすいコードを促進するために存在します
phil294

2
MDNドキュメントは、これらのドキュメントの更新を反映させる必要があります。developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/...を
nardecky
弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.