Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

fix: allow optional trailing comma in asset import.meta.url #6983

Merged
merged 4 commits into from Feb 22, 2022
Merged

fix: allow optional trailing comma in asset import.meta.url #6983

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
dcbb0c8
test: add a failed test case
ydcjeff Feb 18, 2022
d15b43a
fix: add optional trailing comma
ydcjeff Feb 18, 2022
512ea8e
chore: remove comments
ydcjeff Feb 18, 2022
a1d6f7c
fix: allow whitespace characters after trailing comma
ydcjeff Feb 18, 2022
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
45 changes: 45 additions & 0 deletions packages/playground/assets/index.html
View file
Open in desktop
Expand Up @@ -137,6 +137,14 @@ <h2>new URL('...', import.meta.url)</h2>
<img class="import-meta-url-img" />
<code class="import-meta-url"></code>

<h2>new URL('...', import.meta.url,) (with comma)</h2>
<img class="import-meta-url-img-comma" />
<code class="import-meta-url-comma"></code>

<h2>new URL('...', import.meta.url,) (with comma + new line)</h2>
<img class="import-meta-url-img-comma-nl" />
<code class="import-meta-url-comma-nl"></code>

<h2>new URL(`./${dynamic}`, import.meta.url)</h2>
<p>
<img class="dynamic-import-meta-url-img-1" />
Expand All @@ -147,6 +155,16 @@ <h2>new URL(`./${dynamic}`, import.meta.url)</h2>
<code class="dynamic-import-meta-url-2"></code>
</p>

<h2>new URL(`./${dynamic}`, import.meta.url,) (with comma)</h2>
<p>
<img class="dynamic-import-meta-url-img-1-comma" />
<code class="dynamic-import-meta-url-1-comma"></code>
</p>
<p>
<img class="dynamic-import-meta-url-img-2-comma" />
<code class="dynamic-import-meta-url-2-comma"></code>
</p>

<h2>simple script tag import-expression</h2>
<code class="import-expression"></code>
<script>
Expand Down Expand Up @@ -215,6 +233,22 @@ <h3 class="import-css">@import</h3>
const metaUrl = new URL('./nested/asset.png', import.meta.url)
text('.import-meta-url', metaUrl)
document.querySelector('.import-meta-url-img').src = metaUrl

// prettier-ignore
const metaUrlWithComma = new URL('./nested/asset.png', import.meta.url,)
text('.import-meta-url-comma', metaUrlWithComma)
document.querySelector('.import-meta-url-img-comma').src = metaUrlWithComma

// testing trailing comma and new line
// prettier-ignore
const metaUrlWithCommaNL = new URL(
'./nested/asset.png',
import.meta.url,
)
text('.import-meta-url-comma-nl', metaUrlWithCommaNL)
document.querySelector('.import-meta-url-img-comma-nl').src =
metaUrlWithCommaNL

/**
* don't process the code in the comment
* const url = new URL('non_existent_file.png', import.meta.url)
Expand All @@ -229,6 +263,17 @@ <h3 class="import-css">@import</h3>
testDynamicImportMetaUrl('icon', 1)
testDynamicImportMetaUrl('asset', 2)

function testDynamicImportMetaUrlWithComma(name, i) {
// prettier-ignore
const metaUrl = new URL(`./nested/${name}.png`, import.meta.url,)
text(`.dynamic-import-meta-url-${i}-comma`, metaUrl)
document.querySelector(`.dynamic-import-meta-url-img-${i}-comma`).src =
metaUrl
}

testDynamicImportMetaUrlWithComma('icon', 1)
testDynamicImportMetaUrlWithComma('asset', 2)

function text(el, text) {
document.querySelector(el).textContent = text
}
Expand Down
2 changes: 1 addition & 1 deletion packages/vite/src/node/plugins/assetImportMetaUrl.ts
View file
Open in desktop
Expand Up @@ -21,7 +21,7 @@ export function assetImportMetaUrlPlugin(config: ResolvedConfig): Plugin {
async transform(code, id, options) {
if (code.includes('new URL') && code.includes(`import.meta.url`)) {
const importMetaUrlRE =
/\bnew\s+URL\s*\(\s*('[^']+'|"[^"]+"|`[^`]+`)\s*,\s*import\.meta\.url\s*\)/g
/\bnew\s+URL\s*\(\s*('[^']+'|"[^"]+"|`[^`]+`)\s*,\s*import\.meta\.url\s*,?\s*\)/g
const noCommentsCode = code
.replace(multilineCommentsRE, (m) => ' '.repeat(m.length))
.replace(singlelineCommentsRE, (m) => ' '.repeat(m.length))
Expand Down