feat(compiler-sfc): support transforming absolute asset urls

BREAKING CHANGE: `@vue/compiler-sfc`'s `transformAssetUrlsBase` option
has been removed. It is merged into `trasnformAssetUrls` which now also
accepts the format of

  ```ts
  {
    base?: string
    includeAbsolute?: string
    tags?: { [name: string]: string[] }
  }
  ```
This commit is contained in:
Evan You
2020-05-04 16:45:19 -04:00
parent f9a3766fd6
commit 6a0be882d4
9 changed files with 333 additions and 98 deletions

View File

@@ -49,3 +49,17 @@ export function render(_ctx, _cache) {
], 64 /* STABLE_FRAGMENT */))
}"
`;
exports[`compiler sfc: transform asset url with includeAbsolute: true 1`] = `
"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 '/bar.png'
export function render(_ctx, _cache) {
return (_openBlock(), _createBlock(_Fragment, null, [
_createVNode(\\"img\\", { src: _imports_0 }),
_createVNode(\\"img\\", { src: _imports_1 })
], 64 /* STABLE_FRAGMENT */))
}"
`;

View File

@@ -59,3 +59,115 @@ export function render(_ctx, _cache) {
], 64 /* STABLE_FRAGMENT */))
}"
`;
exports[`compiler sfc: transform srcset transform srcset w/ base 1`] = `
"import { createVNode as _createVNode, Fragment as _Fragment, openBlock as _openBlock, createBlock as _createBlock } from \\"vue\\"
export function render(_ctx, _cache) {
return (_openBlock(), _createBlock(_Fragment, null, [
_createVNode(\\"img\\", {
src: \\"./logo.png\\",
srcset: \\"/foo/logo.png\\"
}),
_createVNode(\\"img\\", {
src: \\"./logo.png\\",
srcset: \\"/foo/logo.png 2x\\"
}),
_createVNode(\\"img\\", {
src: \\"./logo.png\\",
srcset: \\"/foo/logo.png 2x\\"
}),
_createVNode(\\"img\\", {
src: \\"./logo.png\\",
srcset: \\"/foo/logo.png, /foo/logo.png 2x\\"
}),
_createVNode(\\"img\\", {
src: \\"./logo.png\\",
srcset: \\"/foo/logo.png 2x, /foo/logo.png\\"
}),
_createVNode(\\"img\\", {
src: \\"./logo.png\\",
srcset: \\"/foo/logo.png 2x, /foo/logo.png 3x\\"
}),
_createVNode(\\"img\\", {
src: \\"./logo.png\\",
srcset: \\"/foo/logo.png, /foo/logo.png 2x, /foo/logo.png 3x\\"
}),
_createVNode(\\"img\\", {
src: \\"/logo.png\\",
srcset: \\"/logo.png, /logo.png 2x\\"
}),
_createVNode(\\"img\\", {
src: \\"https://example.com/logo.png\\",
srcset: \\"https://example.com/logo.png, https://example.com/logo.png 2x\\"
}),
_createVNode(\\"img\\", {
src: \\"/logo.png\\",
srcset: \\"/logo.png, /foo/logo.png 2x\\"
})
], 64 /* STABLE_FRAGMENT */))
}"
`;
exports[`compiler sfc: transform srcset transform srcset w/ includeAbsolute: true 1`] = `
"import { createVNode as _createVNode, Fragment as _Fragment, openBlock as _openBlock, createBlock as _createBlock } from \\"vue\\"
import _imports_0 from './logo.png'
import _imports_1 from '/logo.png'
const _hoisted_1 = _imports_0
const _hoisted_2 = _imports_0 + '2x'
const _hoisted_3 = _imports_0 + '2x'
const _hoisted_4 = _imports_0 + ', ' + _imports_0 + '2x'
const _hoisted_5 = _imports_0 + '2x, ' + _imports_0
const _hoisted_6 = _imports_0 + '2x, ' + _imports_0 + '3x'
const _hoisted_7 = _imports_0 + ', ' + _imports_0 + '2x, ' + _imports_0 + '3x'
const _hoisted_8 = _imports_1 + ', ' + _imports_1 + '2x'
const _hoisted_9 = \\"https://example.com/logo.png\\" + ', ' + \\"https://example.com/logo.png\\" + '2x'
const _hoisted_10 = _imports_1 + ', ' + _imports_0 + '2x'
export function render(_ctx, _cache) {
return (_openBlock(), _createBlock(_Fragment, null, [
_createVNode(\\"img\\", {
src: \\"./logo.png\\",
srcset: _hoisted_1
}),
_createVNode(\\"img\\", {
src: \\"./logo.png\\",
srcset: _hoisted_2
}),
_createVNode(\\"img\\", {
src: \\"./logo.png\\",
srcset: _hoisted_3
}),
_createVNode(\\"img\\", {
src: \\"./logo.png\\",
srcset: _hoisted_4
}),
_createVNode(\\"img\\", {
src: \\"./logo.png\\",
srcset: _hoisted_5
}),
_createVNode(\\"img\\", {
src: \\"./logo.png\\",
srcset: _hoisted_6
}),
_createVNode(\\"img\\", {
src: \\"./logo.png\\",
srcset: _hoisted_7
}),
_createVNode(\\"img\\", {
src: \\"/logo.png\\",
srcset: _hoisted_8
}),
_createVNode(\\"img\\", {
src: \\"https://example.com/logo.png\\",
srcset: _hoisted_9
}),
_createVNode(\\"img\\", {
src: \\"/logo.png\\",
srcset: _hoisted_10
})
], 64 /* STABLE_FRAGMENT */))
}"
`;