diff --git a/playground/assets/__tests__/assets.spec.ts b/playground/assets/__tests__/assets.spec.ts
index 30fc7672a9d55d..46e540d5c7a610 100644
--- a/playground/assets/__tests__/assets.spec.ts
+++ b/playground/assets/__tests__/assets.spec.ts
@@ -147,6 +147,10 @@ describe('asset imports from js', () => {
     expect(await page.textContent('.public-import')).toMatch(iconMatch)
   })
 
+  test('typeof asset import', async () => {
+    expect(await page.textContent('.asset-import-typeof')).toBe('string')
+  })
+
   test('from /public (json)', async () => {
     expect(await page.textContent('.public-json-import')).toMatch(
       '/foo/bar/foo.json',
diff --git a/playground/assets/__tests__/encoded-base/assets-encoded-base.spec.ts b/playground/assets/__tests__/encoded-base/assets-encoded-base.spec.ts
index 5d236696fdf222..900fb34df2c9a8 100644
--- a/playground/assets/__tests__/encoded-base/assets-encoded-base.spec.ts
+++ b/playground/assets/__tests__/encoded-base/assets-encoded-base.spec.ts
@@ -67,6 +67,10 @@ describe('asset imports from js', () => {
       absolutePublicIconMatch,
     )
   })
+
+  test('typeof asset import', async () => {
+    expect(await page.textContent('.asset-import-typeof')).toBe('string')
+  })
 })
 
 describe('css url() references', () => {
diff --git a/playground/assets/__tests__/relative-base/assets-relative-base.spec.ts b/playground/assets/__tests__/relative-base/assets-relative-base.spec.ts
index 7691c7fd669e8b..69b2b324119891 100644
--- a/playground/assets/__tests__/relative-base/assets-relative-base.spec.ts
+++ b/playground/assets/__tests__/relative-base/assets-relative-base.spec.ts
@@ -71,6 +71,10 @@ describe('asset imports from js', () => {
       absolutePublicIconMatch,
     )
   })
+
+  test('typeof asset import', async () => {
+    expect(await page.textContent('.asset-import-typeof')).toBe('string')
+  })
 })
 
 describe('css url() references', () => {
diff --git a/playground/assets/__tests__/runtime-base/assets-runtime-base.spec.ts b/playground/assets/__tests__/runtime-base/assets-runtime-base.spec.ts
index 1534382dcf7386..2b89521b8cabc5 100644
--- a/playground/assets/__tests__/runtime-base/assets-runtime-base.spec.ts
+++ b/playground/assets/__tests__/runtime-base/assets-runtime-base.spec.ts
@@ -64,6 +64,10 @@ describe('asset imports from js', () => {
       absolutePublicIconMatch,
     )
   })
+
+  test('typeof asset import', async () => {
+    expect(await page.textContent('.asset-import-typeof')).toBe('string')
+  })
 })
 
 describe('css url() references', () => {
diff --git a/playground/assets/__tests__/url-base/assets-url-base.spec.ts b/playground/assets/__tests__/url-base/assets-url-base.spec.ts
index 8090d61a6a2280..0e7b044d7e9be9 100644
--- a/playground/assets/__tests__/url-base/assets-url-base.spec.ts
+++ b/playground/assets/__tests__/url-base/assets-url-base.spec.ts
@@ -69,6 +69,10 @@ describe('asset imports from js', () => {
       absolutePublicIconMatch,
     )
   })
+
+  test('typeof asset import', async () => {
+    expect(await page.textContent('.asset-import-typeof')).toBe('string')
+  })
 })
 
 describe('css url() references', () => {
diff --git a/playground/assets/index.html b/playground/assets/index.html
index e847e7fa893cbf..6ba5233498bcd4 100644
--- a/playground/assets/index.html
+++ b/playground/assets/index.html
@@ -32,6 +32,7 @@ <h2>Asset Imports from JS</h2>
   <li>Relative: <code class="asset-import-relative"></code></li>
   <li>Absolute: <code class="asset-import-absolute"></code></li>
   <li>From publicDir: <code class="public-import"></code></li>
+  <li>Typeof asset import: <code class="asset-import-typeof">failed</code></li>
   <li>
     From publicDir (json): <code class="public-json-import"></code> Content:
     <code class="public-json-import-content"></code>
@@ -512,6 +513,11 @@ <h3>assets in template</h3>
   import publicUrl from '/icon.png'
   text('.public-import', publicUrl)
 
+  import typeofAssetUrl from './nested/asset2.png'
+  if (typeof typeofAssetUrl === 'string') {
+    text('.asset-import-typeof', 'string')
+  }
+
   import publicJsonUrl from '/foo.json?url'
   text('.public-json-import', publicJsonUrl)
   ;(async () => {
diff --git a/playground/assets/nested/asset2.png b/playground/assets/nested/asset2.png
new file mode 100644
index 00000000000000..b795d87c3e6b91
Binary files /dev/null and b/playground/assets/nested/asset2.png differ