こちらの記事は以下の書籍を参考にアウトプットとして執筆しました。
入門JavaScriptプログラミング
Reactの勉強を指定いてimportとexportがよくわからなかったため
#モジュールの場所を指定
importを使うときは、「何を」、「どこから」を指定する。
基本構文
import X from Y
項目 | 説明 |
---|---|
X | インポートするもの |
Y | モジュールの場所 |
例
import myFunc from './my_format.js'
モジュールの場所とモジュールから何をインポートするかを指定するには文字リテラルを使う
以下は無効
const MyModule='./my.js'
import myFunc from MyModule;
ということでYのところは絶対に文字列
以下は同等
import myVal from './src/file'
import myVal from './src/file.js'
##Yのファイル拡張子を省略した場合
ファイル拡張子が着いていないパスは、index.jsを含んでいるディレクトリを表す。
// ./src/file.jsと ./src/file/indes.jsの両方と一致
import myVla from './src/file';
// ./src/file.jsのみと一致
import myVal from './src/file.js'
まぁ絶対パスを書いていれば安心。
###ここまでのまとめ
構文は上記
モジュールの場所は文字列で指定
場所は拡張子の省略もできるけど、普通に拡張子まで書いたほうが今は無難
#モジュールから値をインポート
./src/exam/file.js
export default function exam(num){console.log(num)}
import A from './src/exam/file.js'
ここでは./src/exam/file.jsの関数をAという名前でインポートしている
デフォルトエクスポートは好きな名前でインポートできる。