root
/
vue3-core
mirror of https://github.com/vuejs/core.git
1
0
Fork 0
Code Issues Actions 6 Packages Projects Releases Wiki Activity

fix(compiler-sfc): transformAssetUrls.base should not affect known module requests 

fix https://github.com/vitejs/vite/issues/1343
This commit is contained in:
Evan You 2021-01-04 15:09:36 -05:00
parent c92990eff0
commit 2ea9867398
3 changed files with 22 additions and 23 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
packages/compiler-sfc/__tests__/__snapshots__/templateTransformAssetUrl.spec.ts.snap
View File

@ -72,13 +72,16 @@ export function render(_ctx, _cache) {
exports[`compiler sfc: transform asset url with explicit base 1`] = ` exports[`compiler sfc: transform asset url with explicit base 1`] = `
"import { createVNode as _createVNode, Fragment as _Fragment, openBlock as _openBlock, createBlock as _createBlock } from \\"vue\\" "import { createVNode as _createVNode, Fragment as _Fragment, openBlock as _openBlock, createBlock as _createBlock } from \\"vue\\"
import _imports_0 from 'bar.png'
import _imports_1 from '@theme/bar.png'
export function render(_ctx, _cache) { export function render(_ctx, _cache) {
return (_openBlock(), _createBlock(_Fragment, null, [ return (_openBlock(), _createBlock(_Fragment, null, [
_createVNode(\\"img\\", { src: \\"/foo/bar.png\\" }),
_createVNode(\\"img\\", { src: \\"/foo/bar.png\\" }), _createVNode(\\"img\\", { src: \\"/foo/bar.png\\" }),
_createVNode(\\"img\\", { src: \\"bar.png\\" }), _createVNode(\\"img\\", { src: \\"bar.png\\" }),
_createVNode(\\"img\\", { src: \\"@theme/bar.png\\" }) _createVNode(\\"img\\", { src: _imports_0 }),
_createVNode(\\"img\\", { src: _imports_1 })
], 64 /* STABLE_FRAGMENT */)) ], 64 /* STABLE_FRAGMENT */))
}" }"
`; `;

6
packages/compiler-sfc/__tests__/templateTransformAssetUrl.spec.ts
View File

@ -59,13 +59,15 @@ describe('compiler sfc: transform asset url', () => {
test('with explicit base', () => { test('with explicit base', () => {
const { code } = compileWithAssetUrls( const { code } = compileWithAssetUrls(
`<img src="./bar.png"></img>` + // -> /foo/bar.png `<img src="./bar.png"></img>` + // -> /foo/bar.png
`<img src="~bar.png"></img>` + // -> /foo/bar.png
`<img src="bar.png"></img>` + // -> bar.png (untouched) `<img src="bar.png"></img>` + // -> bar.png (untouched)
`<img src="@theme/bar.png"></img>`, // -> @theme/bar.png (untouched) `<img src="~bar.png"></img>` + // -> still converts to import
`<img src="@theme/bar.png"></img>`, // -> still converts to import
{ {
base: '/foo' base: '/foo'
} }
) )
expect(code).toMatch(`import _imports_0 from 'bar.png'`)
expect(code).toMatch(`import _imports_1 from '@theme/bar.png'`)
expect(code).toMatchSnapshot() expect(code).toMatchSnapshot()
}) })

32
packages/compiler-sfc/src/templateTransformAssetUrl.ts
View File

@ -113,26 +113,20 @@ export const transformAssetUrl: NodeTransform = (
} }
const url = parseUrl(attr.value.content) const url = parseUrl(attr.value.content)
if (options.base) { if (options.base && attr.value.content[0] === '.') {
// explicit base - directly rewrite the url into absolute url // explicit base - directly rewrite relative urls into absolute url
// does not apply to absolute urls or urls that start with `@` // to avoid generating extra imports
// since they are aliases // Allow for full hostnames provided in options.base
if ( const base = parseUrl(options.base)
attr.value.content[0] !== '@' && const protocol = base.protocol || ''
isRelativeUrl(attr.value.content) const host = base.host ? protocol + '//' + base.host : ''
) { const basePath = base.path || '/'
// Allow for full hostnames provided in options.base
const base = parseUrl(options.base)
const protocol = base.protocol || ''
const host = base.host ? protocol + '//' + base.host : ''
const basePath = base.path || '/'
// when packaged in the browser, path will be using the posix- // when packaged in the browser, path will be using the posix-
// only version provided by rollup-plugin-node-builtins. // only version provided by rollup-plugin-node-builtins.
attr.value.content = attr.value.content =
host + host +
(path.posix || path).join(basePath, url.path + (url.hash || '')) (path.posix || path).join(basePath, url.path + (url.hash || ''))
}
return return
} }