diff options
author | 2023-09-06 15:01:01 +0200 | |
---|---|---|
committer | 2023-09-06 15:01:01 +0200 | |
commit | 1947ef7a99ce3d1d6ea797842edd31d5edffa5de (patch) | |
tree | 014ebe5f557e4500704e0170bfc2dd78f8d8af16 /packages/integrations/vue | |
parent | 48ff7855b238536a3df17cb29335c90029fc41a4 (diff) | |
download | astro-1947ef7a99ce3d1d6ea797842edd31d5edffa5de.tar.gz astro-1947ef7a99ce3d1d6ea797842edd31d5edffa5de.tar.zst astro-1947ef7a99ce3d1d6ea797842edd31d5edffa5de.zip |
fix: no asset plugin w/ img is imported with query (#8353)
* fix: no asset plugin w/ img is imported with query
* add changeset
* add test for the new feature
* remove exp
* use removeQueryString instead of `includes('?')`
it's more explicit
---------
Co-authored-by: Erika <3019731+Princesseuh@users.noreply.github.com>
Diffstat (limited to 'packages/integrations/vue')
5 files changed, 26 insertions, 3 deletions
diff --git a/packages/integrations/vue/test/app-entrypoint.test.js b/packages/integrations/vue/test/app-entrypoint.test.js index 5c9ea840c..4f4f389d1 100644 --- a/packages/integrations/vue/test/app-entrypoint.test.js +++ b/packages/integrations/vue/test/app-entrypoint.test.js @@ -30,4 +30,12 @@ describe('App Entrypoint', () => { const js = await fixture.readFile(client); expect(js).to.match(/\w+\.component\(\"Bar\"/gm); }); + + it('loads svg components without transforming them to assets', async () => { + const data = await fixture.readFile('/index.html'); + const { document } = parseHTML(data); + const client = document.querySelector('astro-island svg'); + + expect(client).not.to.be.undefined; + }); }); diff --git a/packages/integrations/vue/test/fixtures/app-entrypoint/astro.config.mjs b/packages/integrations/vue/test/fixtures/app-entrypoint/astro.config.mjs index 0bf5fd95d..fa04f9c8b 100644 --- a/packages/integrations/vue/test/fixtures/app-entrypoint/astro.config.mjs +++ b/packages/integrations/vue/test/fixtures/app-entrypoint/astro.config.mjs @@ -1,8 +1,14 @@ import { defineConfig } from 'astro/config'; import vue from '@astrojs/vue'; +import ViteSvgLoader from 'vite-svg-loader' export default defineConfig({ integrations: [vue({ appEntrypoint: '/src/pages/_app' - })] + })], + vite: { + plugins: [ + ViteSvgLoader(), + ], + }, }) diff --git a/packages/integrations/vue/test/fixtures/app-entrypoint/package.json b/packages/integrations/vue/test/fixtures/app-entrypoint/package.json index 3cb7d419b..abdab9e4c 100644 --- a/packages/integrations/vue/test/fixtures/app-entrypoint/package.json +++ b/packages/integrations/vue/test/fixtures/app-entrypoint/package.json @@ -4,6 +4,7 @@ "private": true, "dependencies": { "astro": "workspace:*", - "@astrojs/vue": "workspace:*" + "@astrojs/vue": "workspace:*", + "vite-svg-loader": "4.0.0" } -} +}
\ No newline at end of file diff --git a/packages/integrations/vue/test/fixtures/app-entrypoint/src/components/Circle.svg b/packages/integrations/vue/test/fixtures/app-entrypoint/src/components/Circle.svg new file mode 100644 index 000000000..1b207e41a --- /dev/null +++ b/packages/integrations/vue/test/fixtures/app-entrypoint/src/components/Circle.svg @@ -0,0 +1,3 @@ +<svg viewBox="0 0 100 100" fill="none" xmlns="http://www.w3.org/2000/svg"> + <circle cx="50" cy="50" r="40" stroke="green" stroke-width="4" fill="yellow" /> +</svg> diff --git a/packages/integrations/vue/test/fixtures/app-entrypoint/src/components/Foo.vue b/packages/integrations/vue/test/fixtures/app-entrypoint/src/components/Foo.vue index 3e648808c..e07193d36 100644 --- a/packages/integrations/vue/test/fixtures/app-entrypoint/src/components/Foo.vue +++ b/packages/integrations/vue/test/fixtures/app-entrypoint/src/components/Foo.vue @@ -1,5 +1,10 @@ +<script setup> +import Circle from './Circle.svg?component' +</script> + <template> <div id="foo"> <Bar /> + <Circle/> </div> </template> |