* doc:add a warn about '~' in src-imports (#2375)

* Update src/api/sfc-spec.md



* Update src/api/sfc-spec.md



* doc(import statement): add import statement in script setup

* doc(import statement): delete extraneous blank lines

---------

Co-authored-by: 包伟斌 <[email protected]>
Co-authored-by: Natalia Tepluhina <[email protected]>

Author: 3 people

src/api/sfc-script-setup.md

@@ -479,6 +479,20 @@ const post = await fetch(`/api/post/1`).then((r) => r.json())
 `async setup()` は、現在まだ実験的な機能である [`Suspense`](/guide/built-ins/suspense.html) と組み合わせて使用する必要があります。将来のリリースで完成させてドキュメント化する予定ですが、もし今興味があるのであれば、その[テスト](https://github.com/vuejs/core/blob/main/packages/runtime-core/__tests__/components/Suspense.spec.ts)を参照することで、どのように動作するかを確認できます。
 :::
 
+## インポート文 {#imports-statements}
+
+Vue のインポート文は [ECMAScript モジュールの仕様](https://nodejs.org/api/esm.html)に従います。
+さらに、ビルドツール設定で定義されたエイリアスを使用することができます:
+
+```vue
+<script setup>
+import { ref } from 'vue'
+import { componentA } from './Components'
+import { componentB } from '@/Components'
+import { componentC } from '~/Components'
+</script>
+```
+
 ## ジェネリクス <sup class="vt-badge ts" /> {#generics}
 
 `<script>` タグの `generic` 属性を使ってジェネリック型パラメーターを宣言できます:

src/api/sfc-spec.md

@@ -136,6 +136,13 @@ p {{ msg }}
 </unit-test>
 ```
 
+:::warning Note
+`src` でエイリアスを使用する場合、モジュールリクエストとして解釈される `~` から始めないでください。これは、ノードモジュール内のアセットを参照できることを意味します:
+```vue
+<img src="~some-npm-package/foo.png">
+```
+:::
+
 ## コメント {#comments}
 
 各ブロックの中では、使用されている言語（HTML、CSS、JavaScript、Pug など）のコメント構文を使用する必要があります。トップレベルのコメントには、HTML のコメント構文を使用します: `<!-- コメント内容をここに -->`