Skip to content

Commit

Permalink
fix: respect vite base config for absolute URLs during dev
Browse files Browse the repository at this point in the history
  • Loading branch information
yyx990803 committed Dec 1, 2023
1 parent 6bd09a1 commit 44d3eb0
Show file tree
Hide file tree
Showing 9 changed files with 67 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 @@ -125,6 +125,7 @@ export function resolveTemplateCompilerOptions(
(options.devServer.config.server?.origin ?? '') +
devBase +
slash(path.relative(options.root, path.dirname(filename))),
includeAbsolute: !!devBase,
}
}
} else if (transformAssetUrls !== false) {
Expand Down
4 changes: 4 additions & 0 deletions playground/vue-asset-base/Main.vue
Original file line number Diff line number Diff line change
@@ -0,0 +1,4 @@
<template>
<img alt="Vue logo" src="./assets/asset.png" />
<img alt="Vue logo" src="/assets/asset.png" />
</template>
11 changes: 11 additions & 0 deletions playground/vue-asset-base/__tests__/vue-asset-base.spec.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,11 @@
import { expect, test } from 'vitest'
import { isBuild, page } from '~utils'

test('should render', async () => {
const expected = isBuild
? /^\/foo\/assets\/asset-[-\w]+\.png/
: /^\/foo\/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-asset-base/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-asset-base/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-asset-base/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-asset-base/package.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,17 @@
{
"name": "@vitejs/test-vue-server-origin",
"private": true,
"version": "0.0.0",
"scripts": {
"dev": "vite",
"build": "vite build",
"debug": "node --inspect-brk vite",
"preview": "vite preview"
},
"dependencies": {
"vue": "^3.3.8"
},
"devDependencies": {
"@vitejs/plugin-vue": "workspace:*"
}
}
16 changes: 16 additions & 0 deletions playground/vue-asset-base/vite.config.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,16 @@
import { defineConfig } from 'vite'
import vuePlugin from '@vitejs/plugin-vue'

export default defineConfig({
base: '/foo/',
resolve: {
alias: {
'@': __dirname,
},
},
plugins: [vuePlugin()],
build: {
// to make tests faster
minify: false,
},
})
10 changes: 10 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 44d3eb0

Please sign in to comment.