diff --git a/src/content/blog/2024-08-05-using-dynamic-import-for-astro-assets.mdx b/src/content/blog/2024-08-05-using-dynamic-import-for-astro-assets.mdx index 15468c4..e305ca6 100644 --- a/src/content/blog/2024-08-05-using-dynamic-import-for-astro-assets.mdx +++ b/src/content/blog/2024-08-05-using-dynamic-import-for-astro-assets.mdx @@ -14,7 +14,7 @@ import logoImage from '../assets/logo.svg'; Yuhei Yasuda ``` -しかし、このような書き方をするとやや不便なことがある。それはimport文を使うと、実際にアセットを使用する箇所から離れた部分に記述が分散するため、一見して対応関係がわかりづらくなることである。例のように行数の少ないファイルではそれほどではないが、行数の多いファイルでは、離れた箇所に記述すると非常に煩わしいことになる。 +しかし、このような書き方をするとやや不便なことがある。それはimport文を使うと、実際にアセットを使用する箇所から離れた部分に記述が分散するため、一見して対応関係がわかりづらくなることである。かつ、編集が面倒になる。例のように行数の少ないファイルではそれほどではないが、行数の多いファイルでは、離れた箇所に記述すると非常に煩わしいことになる。 そこで、代わりにdynamic importを使うことで、アセットの読み込みをインライン化することができる。``コンポーネントの`src` propはPromiseに対応しているため、ここで直接dynamic importを使用できる。