From 626127f36ad32fc4b67165591d85586097de1978 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=8C=85=E4=BC=9F=E6=96=8C?= <1813148814@qq.com>
Date: Sat, 12 Oct 2024 09:42:51 +0800
Subject: [PATCH 1/5] doc:add a warn about '~' in src-imports

---
 src/api/sfc-spec.md | 7 +++++++
 1 file changed, 7 insertions(+)

diff --git a/src/api/sfc-spec.md b/src/api/sfc-spec.md
index 337dddf207..cee8ea4251 100644
--- a/src/api/sfc-spec.md
+++ b/src/api/sfc-spec.md
@@ -136,6 +136,13 @@ Beware that `src` imports follow the same path resolution rules as webpack modul
 </unit-test>
 ```
 
+:::warning Note
+While using aliases in `src`,don't start with `~`(It can be used in `import` seq ), anything after it is interpreted as a module request. This means you can reference assets inside node modules:
+```vue
+<img src="~some-npm-package/foo.png">
+```
+:::
+
 ## Comments {#comments}
 
 Inside each block you shall use the comment syntax of the language being used (HTML, CSS, JavaScript, Pug, etc.). For top-level comments, use HTML comment syntax: `<!-- comment contents here -->`

From cb80c3577049247a8a733d3dda21e2c0106db393 Mon Sep 17 00:00:00 2001
From: Bayn Web <73877052+Bayn-Web@users.noreply.github.com>
Date: Mon, 14 Oct 2024 16:41:22 +0800
Subject: [PATCH 2/5] Update src/api/sfc-spec.md

Co-authored-by: Natalia Tepluhina <tarya.se@gmail.com>
---
 src/api/sfc-spec.md | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/api/sfc-spec.md b/src/api/sfc-spec.md
index cee8ea4251..7b13e3bba5 100644
--- a/src/api/sfc-spec.md
+++ b/src/api/sfc-spec.md
@@ -137,7 +137,7 @@ Beware that `src` imports follow the same path resolution rules as webpack modul
 ```
 
 :::warning Note
-While using aliases in `src`,don't start with `~`(It can be used in `import` seq ), anything after it is interpreted as a module request. This means you can reference assets inside node modules:
+While using aliases in `src`, don't start with `~`(it can be used in `import` seq ), anything after it is interpreted as a module request. This means you can reference assets inside node modules:
 ```vue
 <img src="~some-npm-package/foo.png">
 ```

From 05547f6bc49b47b268b879f18c2c7d345d446818 Mon Sep 17 00:00:00 2001
From: Bayn Web <73877052+Bayn-Web@users.noreply.github.com>
Date: Wed, 16 Oct 2024 09:04:26 +0800
Subject: [PATCH 3/5] Update src/api/sfc-spec.md

Co-authored-by: Natalia Tepluhina <tarya.se@gmail.com>
---
 src/api/sfc-spec.md | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/api/sfc-spec.md b/src/api/sfc-spec.md
index 7b13e3bba5..cdfb789836 100644
--- a/src/api/sfc-spec.md
+++ b/src/api/sfc-spec.md
@@ -137,7 +137,7 @@ Beware that `src` imports follow the same path resolution rules as webpack modul
 ```
 
 :::warning Note
-While using aliases in `src`, don't start with `~`(it can be used in `import` seq ), anything after it is interpreted as a module request. This means you can reference assets inside node modules:
+While using aliases in `src`, don't start with `~`, anything after it is interpreted as a module request. This means you can reference assets inside node modules:
 ```vue
 <img src="~some-npm-package/foo.png">
 ```

From 64386ff51d01b669c5e88cb912b3b2fe09c27557 Mon Sep 17 00:00:00 2001
From: Bayn-Web <Bayn1404@gmail.com>
Date: Fri, 18 Oct 2024 09:48:33 +0800
Subject: [PATCH 4/5] doc(import statement): add import statement in script
 setup

---
 src/api/sfc-script-setup.md | 16 ++++++++++++++++
 1 file changed, 16 insertions(+)

diff --git a/src/api/sfc-script-setup.md b/src/api/sfc-script-setup.md
index 9dcfa2909d..0de198752c 100644
--- a/src/api/sfc-script-setup.md
+++ b/src/api/sfc-script-setup.md
@@ -479,6 +479,22 @@ In addition, the awaited expression will be automatically compiled in a format t
 `async setup()` must be used in combination with [`Suspense`](/guide/built-ins/suspense.html), which is currently still an experimental feature. We plan to finalize and document it in a future release - but if you are curious now, you can refer to its [tests](https://github.com/vuejs/core/blob/main/packages/runtime-core/__tests__/components/Suspense.spec.ts) to see how it works.
 :::
 
+## Import Statements {#imports-statements}
+
+Import statements in vue follow [ECMAScript module specification](https://nodejs.org/api/esm.html).
+
+In addition, you can use aliases defined in your build tool configuration:
+
+```vue
+<script setup>
+import { ref } from 'vue'
+import { componentA } from './Components'
+import { componentB } from '@/Components'
+import { componentC } from '~/Components'
+</script>
+```
+
+
 ## Generics <sup class="vt-badge ts" /> {#generics}
 
 Generic type parameters can be declared using the `generic` attribute on the `<script>` tag:

From 6ac2586ddbf4fd349fdf7a3959907a34a6215544 Mon Sep 17 00:00:00 2001
From: Bayn-Web <Bayn1404@gmail.com>
Date: Fri, 18 Oct 2024 09:51:30 +0800
Subject: [PATCH 5/5] doc(import statement): delete extraneous blank lines

---
 src/api/sfc-script-setup.md | 2 --
 1 file changed, 2 deletions(-)

diff --git a/src/api/sfc-script-setup.md b/src/api/sfc-script-setup.md
index 0de198752c..89bd6f4440 100644
--- a/src/api/sfc-script-setup.md
+++ b/src/api/sfc-script-setup.md
@@ -482,7 +482,6 @@ In addition, the awaited expression will be automatically compiled in a format t
 ## Import Statements {#imports-statements}
 
 Import statements in vue follow [ECMAScript module specification](https://nodejs.org/api/esm.html).
-
 In addition, you can use aliases defined in your build tool configuration:
 
 ```vue
@@ -494,7 +493,6 @@ import { componentC } from '~/Components'
 </script>
 ```
 
-
 ## Generics <sup class="vt-badge ts" /> {#generics}
 
 Generic type parameters can be declared using the `generic` attribute on the `<script>` tag: