Skip to content

Commit

Permalink
fix(plugin-vue): use server.origin when building base for transformAs…
Browse files Browse the repository at this point in the history
…setUrls (#8077)
  • Loading branch information
segevfiner authored May 15, 2022
1 parent 462be8e commit 2f7a490
Show file tree
Hide file tree
Showing 9 changed files with 72 additions and 0 deletions.
1 change: 1 addition & 0 deletions packages/plugin-vue/src/template.ts
Original file line number Diff line number Diff line change
Expand Up @@ -119,6 +119,7 @@ export function resolveTemplateCompilerOptions(
if (filename.startsWith(options.root)) {
assetUrlOptions = {
base:
(options.devServer.config.server?.origin ?? '') +
options.devServer.config.base +
slash(path.relative(options.root, path.dirname(filename)))
}
Expand Down
8 changes: 8 additions & 0 deletions playground/vue-server-origin/Main.vue
Original file line number Diff line number Diff line change
@@ -0,0 +1,8 @@
<script setup lang="ts">
import asset from './assets/asset.png'
</script>

<template>
<img alt="Vue logo" src="./assets/asset.png" />
<img alt="Vue logo" :src="asset" />
</template>
10 changes: 10 additions & 0 deletions playground/vue-server-origin/__tests__/vue-server-origin.spec.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,10 @@
import { isBuild } from 'testUtils'

test('should render', async () => {
const expected = isBuild
? /assets\/asset\.[0-9a-f]+\.png/
: /https:\/\/vue-server-origin\.test\/assets\/asset\.png/

expect(await page.getAttribute('img', 'src')).toMatch(expected)
expect(await page.getAttribute('img:nth-child(2)', 'src')).toMatch(expected)
})
Binary file added playground/vue-server-origin/assets/asset.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
1 change: 1 addition & 0 deletions playground/vue-server-origin/env.d.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1 @@
declare module '*.png'
7 changes: 7 additions & 0 deletions playground/vue-server-origin/index.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,7 @@
<div id="app"></div>
<script type="module">
import { createApp, defineCustomElement } from 'vue'
import Main from './Main.vue'

createApp(Main).mount('#app')
</script>
17 changes: 17 additions & 0 deletions playground/vue-server-origin/package.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,17 @@
{
"name": "test-vue-server-origin",
"private": true,
"version": "0.0.0",
"scripts": {
"dev": "vite",
"build": "vite build",
"debug": "node --inspect-brk ../../packages/vite/bin/vite",
"preview": "vite preview"
},
"dependencies": {
"vue": "^3.2.25"
},
"devDependencies": {
"@vitejs/plugin-vue": "workspace:*"
}
}
19 changes: 19 additions & 0 deletions playground/vue-server-origin/vite.config.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,19 @@
import { defineConfig } from 'vite'
import vuePlugin from '@vitejs/plugin-vue'

export default defineConfig({
base: '',
resolve: {
alias: {
'@': __dirname
}
},
plugins: [vuePlugin()],
server: {
origin: 'https://vue-server-origin.test'
},
build: {
// to make tests faster
minify: false
}
})
9 changes: 9 additions & 0 deletions pnpm-lock.yaml

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

0 comments on commit 2f7a490

Please sign in to comment.