From f10c7cc97a835af0d6e87e1f818ec4ba429d714d Mon Sep 17 00:00:00 2001 From: Rom Date: Sun, 27 Mar 2022 06:59:51 +0200 Subject: [PATCH 01/70] chore: also run CI on `fix/*` and `perf/*` branches (#7435) --- .github/workflows/ci.yml | 2 ++ 1 file changed, 2 insertions(+) diff --git a/.github/workflows/ci.yml b/.github/workflows/ci.yml index dfccbea368c449..cde7dfb03825ed 100644 --- a/.github/workflows/ci.yml +++ b/.github/workflows/ci.yml @@ -11,6 +11,8 @@ on: - main - release/* - feat/* + - fix/* + - perf/* pull_request: workflow_dispatch: From 4c95e9953a5c2790cdf54dbb27bfdf3dbb352eed Mon Sep 17 00:00:00 2001 From: patak Date: Sun, 27 Mar 2022 07:00:45 +0200 Subject: [PATCH 02/70] fix: optimizeDeps.entries default ignore paths (#7469) --- docs/config/index.md | 4 ++-- packages/vite/src/node/optimizer/scan.ts | 5 ++++- 2 files changed, 6 insertions(+), 3 deletions(-) diff --git a/docs/config/index.md b/docs/config/index.md index b0d2f59d4a62af..a8d8cb36079f0a 100644 --- a/docs/config/index.md +++ b/docs/config/index.md @@ -973,9 +973,9 @@ export default defineConfig({ - **Type:** `string | string[]` - By default, Vite will crawl your `index.html` to detect dependencies that need to be pre-bundled. If `build.rollupOptions.input` is specified, Vite will crawl those entry points instead. + By default, Vite will crawl all your `.html` files to detect dependencies that need to be pre-bundled (ignoring `node_modules`, `build.outDir`, `__tests__` and `coverage`). If `build.rollupOptions.input` is specified, Vite will crawl those entry points instead. - If neither of these fit your needs, you can specify custom entries using this option - the value should be a [fast-glob pattern](https://github.com/mrmlnc/fast-glob#basic-syntax) or array of patterns that are relative from Vite project root. This will overwrite default entries inference. + If neither of these fit your needs, you can specify custom entries using this option - the value should be a [fast-glob pattern](https://github.com/mrmlnc/fast-glob#basic-syntax) or array of patterns that are relative from Vite project root. This will overwrite default entries inference. Only `node_modules` and `build.outDir` folders will be ignored by default when `optimizeDeps.entries` is explicitily defined. If other folders needs to be ignored, you can use an ignore pattern as part of the entries list, marked with an initial `!`. ### optimizeDeps.exclude diff --git a/packages/vite/src/node/optimizer/scan.ts b/packages/vite/src/node/optimizer/scan.ts index 549f748d9a2b58..e940617386eb35 100644 --- a/packages/vite/src/node/optimizer/scan.ts +++ b/packages/vite/src/node/optimizer/scan.ts @@ -142,7 +142,10 @@ function globEntries(pattern: string | string[], config: ResolvedConfig) { ignore: [ '**/node_modules/**', `**/${config.build.outDir}/**`, - `**/__tests__/**` + // if there aren't explicit entries, also ignore other common folders + ...(config.optimizeDeps.entries + ? [] + : [`**/__tests__/**`, `**/coverage/**`]) ], absolute: true }) From 9ee2cf6ccee473eaa62fbf2a0cb84797bfdf2201 Mon Sep 17 00:00:00 2001 From: Artur Date: Sun, 27 Mar 2022 08:04:45 +0300 Subject: [PATCH 03/70] fix: Correctly process urls when they are rewritten to contain space (#7452) --- packages/playground/css/__tests__/css.spec.ts | 6 ++++++ packages/playground/css/folder with space/ok.png | Bin 0 -> 4986 bytes .../playground/css/folder with space/space.css | 5 +++++ packages/playground/css/imported.css | 1 + packages/playground/css/index.html | 4 ++++ packages/playground/css/vite.config.js | 3 ++- packages/vite/src/node/plugins/css.ts | 7 ++++++- 7 files changed, 24 insertions(+), 2 deletions(-) create mode 100644 packages/playground/css/folder with space/ok.png create mode 100644 packages/playground/css/folder with space/space.css diff --git a/packages/playground/css/__tests__/css.spec.ts b/packages/playground/css/__tests__/css.spec.ts index 34858ab34bc09d..3fe4a09bcc94c8 100644 --- a/packages/playground/css/__tests__/css.spec.ts +++ b/packages/playground/css/__tests__/css.spec.ts @@ -54,6 +54,12 @@ test('css import from js', async () => { await untilUpdated(() => getColor(atImport), 'blue') }) +test('css import asset with space', async () => { + const importedWithSpace = await page.$('.import-with-space') + + expect(await getBg(importedWithSpace)).toMatch(/.*ok\..*png/) +}) + test('postcss config', async () => { const imported = await page.$('.postcss .nesting') expect(await getColor(imported)).toBe('pink') diff --git a/packages/playground/css/folder with space/ok.png b/packages/playground/css/folder with space/ok.png new file mode 100644 index 0000000000000000000000000000000000000000..a8d1e52510c41ceeaf3515ee2f594a82557d1685 GIT binary patch literal 4986 zcmZ`*2RK|?*B+e_JxHPrqC^`dI%D+CL?i|g27@8m=!PJK=%R!nQKA!~B)aHPqD6@= zdX1Xs?IXGWz4!UQ|3BwBXT4{y^{#jAwa>H935DsXk^yf40RRA*x|)*SrIo+D1c?bR z?>eFMtN;LT2BoM7Q&&_3!O)IYs3%AOKrJ*Okx2i(;Vu6y%xWZ*nhnJ9i&KruKfWK2 zyFN@q4VQ$YH7MOol~C15pOUIc*gumE7!~CoK~QR@T#8_ck(W0lA{Eo$$I(o}%GP4` z{gywSytz0#03S?ZdM^O!LEBja*Wk4NTIv;iY>g?j^l6RFdwA68IJmpt=64qLbl`Ae zsHN?BVO;}h`p(g-;i~t37w4wWIVro20MJlkF4Bclt)PjRoiK0$63<^MVudWxQnUR? ztoho_SWq+G{A;OB)6bG#&%PGWh~1-t5HsNTbN%!z(+6~jy+}=H(N#W;X`!rmN!&^u zWWfHTiGBy4nBBSQU3d38XJ&=bYo&>}Pz0!3=RB@&sNqoe;qmg0UV@C_NYIRL8yZCj zKDd}nzTn5+49ma4*#Qc-44~@hR@&cs?ESDLmZS5hLN1&ysU*$pC7Ymk*bzD{=nmbs zPhf(b$kKBy=djVV!e4Pck;lVEfh(vYePen*(4_xexEL1)_4uNw7g9S@HCXq4M@ zoTDVHrmue)WDm@>_lft$vMFF2VAM0ROe3a-n4DAHy|C)8k7IB1pvaB7)zjzHy&rVF zUJHu{^p7}>a~h$*J^K$o$65v5*?4{vN26YbORrjtLGtyWT}wPB=`$%X#e9bJ6iU2X z0=-*8A4PbXeAZR z0kwH*@;Bs$eAF&xp*LP@J@yO0MgSi=-}Ir^h8{443rHS60vh&ak;|Sp1K84W3H$MD z8Yz=-cyCK{%@EebLIt^;PVmLL0P#8Q<@&aNZbRBN>~_iRiPph zIKBR)Gr%gGP5+Q|qF;fDW;g1HGAZ$AK|rODyR5PuH_C#3fW#JXj^tTk_}3{oRuxPPfcU$Yax& zEFc{Aw^epacgXODDdy?g@FhoCWfb*0tUz7wCPzPxcpN(IU#zsHDxT4o;h2H>+Opz! z1E|7a5$fFLB;=f=-%YK>n!{L5?{dwB*@b8@+AF%v91FkyPDG57AzHgdpv9qavsKJ| zqQqnr@`IQ>WU$q6ZqhkJf?0sU;Kf9g^b6_8+R*iO-`2QoZ%^quIS3B8X?gz34$*e* zw)jrpPA2|?XF^R0lp2(jXp$6S3~^D=deGBm?t76o8m?R_RD&<YJhyi6i@G1>fr2=#kL(>V|RoR808IB-F{LdAHGCc25bC1PG#!Gb> zcF}aH($<811R5x(muX~cWUDXcbn)^8*lI1p==FZ)Ee>T4tq-w2cvcWv5Y40OmTjA` z<~-~$OeI>ATx67Ilrv8F5zjVph|oqNnWQJ0Go7~I7G;g{b-g|nv#Gc|I5Ke1-#2)2 z6CQjg@Qa$obrEtQshcfpcio8gZtP{RJy_!!#w2m)ki>oIHghm%Moc50re=r)iYQ80 zoJ9oR6u0*2Ps*RoW*y=luo}wKENoc8gM~X3(8HF-}S}_+#k^t*RIq$h~G?SHtAE; zeP@v4VYEe{`KAqlEa8DK!&{EWj{}Z@XSQcLXZP^#2igSs1gZqK2P-L7Ai@w>MD1+J z%ha!rG8a|$R45`yK0mQ|xg$1DK2O1!!&%C?u9d7!s3odZo#U0WmlNI1ZIx;j-ecSC zkYdp@wzRq=-Qx&vq>G|s3+D-6e^rtlmpzKkMUL=w^CcR_8j6jgEMzS7E_`g4 zw_E_MhwvHyETzr9YV@Oxa_?>Ko2@ zPUucX$X}5wgqV;YFs??qFpWr7NI!K$yT?k3N{~r0NODPTIc-{rj3R!J{RkJhLGPIO zK!EEJq*|)ls+QULtfi-me`>>jqLFb>vRM+d^sAbo>gQzP6h;Qltj;Xw{mXL=vnyjK zljeQXo1|{vTXs3gWk7;R@_n6s9df$8PVTVk_}w<@r}7cuA>EPt@z>M0XFO-AhYW|g z$0H{cL=uF2q&B3j_=H5S@ZDY9s(c)nJR~|KZIt_~&CpJkPRQ*+%5X|Uwe?4y4*iq- zE-XDFsa)6*Mxa7TOx{y@h~|gL~8WQr(cePqVN!8Q&~M)?Gto5wg-AEyAUYS<`Fi{82!57b+o4W zD@K!o3jMNQw#CYu$CJxm=U#IBir{&$ooR7{PtWc&?Q7a$-i(A!-U)-7#XRug1}U?> zbJ14ORlDNFiG{?a24jZWijUA-GdKC~9ys5J=?kuR0c%I9izd!wk1;z3Z`LSywJN-PPZYbsV2I|wJZ^I=<`y4-hJYM-n#?h~69@aKjf z5-M^Jhww!g#mL0NlQBkf#x+qyOpcCjcC!10d+$$lR?_mM@}Hsy@66>tyKj;EQz!a^ z`b2PVR_dyq>CpN1lgY7(<>o%OR0@dS&a;c>zJ9JugL347yeR;I6Pc_k}$v6Md_Wa|X@ph%E1=hks zFEv8^D=<9pNAN#MXH$e=^Q0EJ?l zl6q7QM>gt#Fz6BbIba1h8bmhu4s0RRWrBV8DSGcy8l!c?c0K(GI94X*w?{q~0 z$aqR!LVKhu0_17`#KA?%Q6%3t)$Cs{TdS63$~FxbPxL%>5sz!7Z?7Lt^d1Pcm-g@ySqBlums99$8e z{0=Vcf0F!99wnrU1sdh#igI)SUFAiXJG!~bvawwW{eAqY6X}WiN6EqEuW4OQ5PanU z3ke8<|1X*=%Ig22U3vb{e$VTVoXk}+DHzHV`NU8OWq;Y#%hDisC1if9{FmdOI{y$K zxFFGrj`o*4SI9rB@)!Bv&i_sPtqA`|QB3sTivM!_i+D8wDP1(`QVem`L5PqH_`k;f zikAUjwfA4`{0+a#&{bE3XOap7%002R{x{|!U4Z#K+rKN9h9fHTfT6Qa) z4{Y6ddS0CkX-^>( zxOjLJxD?HkmW|f9X(T?J-K>8B5U!8p_M(61HW1B-4GmSN3{~nM*yVCP_|+K4b!KLB z$dic+l{Nn~6Rv(AC z1FKTm+S}V%*C$6{`uey*iK-|21TA0l)Zn!b6Cd>K^JCW9zdDONx>MU-aB#R|I%m~eo6M=u^BIkm z)j>ayAomTE7{2gmxhQ+2kmf5zJ3HR0DsMBH-6mGnlP2pv2SGtW=ux>fyVIU6?ZVQc zqMx6fue;}F&=${^rluz5y(;0X9||qa2pgLh$)jUq^4{J&c?AV%wviuOw zl@44MJUqPcU-29<#^lxwU9BXcLz`{Qj`Z1|?oN)6kH?(#NRED*!n(hFC*idl{~>wO z-PTBIvWDZWRMtXRI8ffy)U>!qL&{JdvX-rHG@yA*_I1o}%g&6K7Of>-& zJPsz)BO@Xt`UuJhtx}x-~LVnovYU1icaewG;TPzZv)Jd+hNg@vGls}^HS%XRuS z^M|k4sqW=@pTZf}f$T7<^l6_Z8-4uI@o^YcwWgX5M6|&;Uxt_XHc+yL5Z^}uFE%vn zHD_V5NyylkAvO?1gV65Lotd3|o-0Q|;j#VmXF@($H!mlL&@?AELqn+i`TL@xmI`4k z2lzop7xdiL_pI+m;uEW9&v0kSmIUODjY&VJ%7yIjlXD9Q1XNVG53!@(q@}g2*ko!o zJJst~!}YJJtDC|^%7VTPf8&#A);uj*sJ~6zDruM_EL;v^XAgJbL)XSTu`zeBBq%?U z2N_mgK)ENYf0DW>E=AYXF@hEg_+pL8V?hgS>|&g^9L_!QaPdw#%(0FvX|hg51=O(+ zT}uN08)f#XS#M%#R#yi*tImpx3PaW|qQ(YlzSz5T;iHzjk)*PuF-%h(9o+mRG&D3N zC4$SYoje;`%9V)(&Ed=+%H~~oh>%2Q4M+3xX6M9L8{i|vF824%=R&;w2fP57lKV)S b37?V{t|cgkE9S{uec08Nb(D$~%%1%R{RRHc literal 0 HcmV?d00001 diff --git a/packages/playground/css/folder with space/space.css b/packages/playground/css/folder with space/space.css new file mode 100644 index 00000000000000..55a8532da32a94 --- /dev/null +++ b/packages/playground/css/folder with space/space.css @@ -0,0 +1,5 @@ +.import-with-space { + color: green; + background: url(spacefolder/ok.png); + background-position: center; +} diff --git a/packages/playground/css/imported.css b/packages/playground/css/imported.css index 65743d08b932a7..7d582995fab9fd 100644 --- a/packages/playground/css/imported.css +++ b/packages/playground/css/imported.css @@ -1,4 +1,5 @@ @import './imported-at-import.css'; +@import 'spacefolder/space.css'; .imported { color: green; diff --git a/packages/playground/css/index.html b/packages/playground/css/index.html index a09d8e6e7c46aa..060aed7fb1b27f 100644 --- a/packages/playground/css/index.html +++ b/packages/playground/css/index.html @@ -10,6 +10,10 @@

CSS

@import in import from js: This should be purple

+

+ @import from file with space: This should be green and have a background + image +

Imported css string:


   

diff --git a/packages/playground/css/vite.config.js b/packages/playground/css/vite.config.js
index 53d001d8387989..639a1302debb88 100644
--- a/packages/playground/css/vite.config.js
+++ b/packages/playground/css/vite.config.js
@@ -9,7 +9,8 @@ module.exports = {
   },
   resolve: {
     alias: {
-      '@': __dirname
+      '@': __dirname,
+      spacefolder: __dirname + '/folder with space'
     }
   },
   css: {
diff --git a/packages/vite/src/node/plugins/css.ts b/packages/vite/src/node/plugins/css.ts
index 87de63ef3ec306..4933f8455931c1 100644
--- a/packages/vite/src/node/plugins/css.ts
+++ b/packages/vite/src/node/plugins/css.ts
@@ -1029,7 +1029,12 @@ async function doUrlReplace(
     return matched
   }
 
-  return `url(${wrap}${await replacer(rawUrl)}${wrap})`
+  const newUrl = await replacer(rawUrl)
+  if (wrap === '' && newUrl !== encodeURI(newUrl)) {
+    // The new url might need wrapping even if the original did not have it, e.g. if a space was added during replacement
+    wrap = "'"
+  }
+  return `url(${wrap}${newUrl}${wrap})`
 }
 
 async function doImportCSSReplace(

From 8ac4b12fefb42c748e92f0ea5f93374a0739748e Mon Sep 17 00:00:00 2001
From: yoho 
Date: Sun, 27 Mar 2022 15:46:49 +0800
Subject: [PATCH 04/70] fix: import.meta.url in worker (#7464)

---
 packages/playground/worker/__tests__/worker.spec.ts | 7 +++++--
 packages/playground/worker/sub-worker.js            | 2 +-
 packages/playground/worker/url-worker.js            | 2 +-
 packages/vite/src/node/plugins/define.ts            | 8 +++++++-
 4 files changed, 14 insertions(+), 5 deletions(-)

diff --git a/packages/playground/worker/__tests__/worker.spec.ts b/packages/playground/worker/__tests__/worker.spec.ts
index fc381467f6a4d2..263c49cff52fb9 100644
--- a/packages/playground/worker/__tests__/worker.spec.ts
+++ b/packages/playground/worker/__tests__/worker.spec.ts
@@ -51,8 +51,11 @@ test.concurrent.each([[true], [false]])('shared worker', async (doTick) => {
   await waitSharedWorkerTick(page)
 })
 
-test('worker emitted', async () => {
-  await untilUpdated(() => page.textContent('.nested-worker'), 'pong')
+test('worker emitted and import.meta.url in nested worker', async () => {
+  await untilUpdated(
+    () => page.textContent('.nested-worker'),
+    'pong http://localhost:3000/iife/sub-worker.js?worker_file'
+  )
 })
 
 if (isBuild) {
diff --git a/packages/playground/worker/sub-worker.js b/packages/playground/worker/sub-worker.js
index eec65b86a0382a..eff49dfbb46ba6 100644
--- a/packages/playground/worker/sub-worker.js
+++ b/packages/playground/worker/sub-worker.js
@@ -1,5 +1,5 @@
 self.onmessage = (event) => {
   if (event.data === 'ping') {
-    self.postMessage('pong')
+    self.postMessage(`pong ${import.meta.url}`)
   }
 }
diff --git a/packages/playground/worker/url-worker.js b/packages/playground/worker/url-worker.js
index 79d05da0f06082..c25cbefdff89ec 100644
--- a/packages/playground/worker/url-worker.js
+++ b/packages/playground/worker/url-worker.js
@@ -1 +1 @@
-self.postMessage('A string' + import.meta.env.BASE_URL)
+self.postMessage('A string' + import.meta.env.BASE_URL + import.meta.url)
diff --git a/packages/vite/src/node/plugins/define.ts b/packages/vite/src/node/plugins/define.ts
index 19ca28b34433a0..024cf32d41f72a 100644
--- a/packages/vite/src/node/plugins/define.ts
+++ b/packages/vite/src/node/plugins/define.ts
@@ -10,6 +10,7 @@ const isNonJsRequest = (request: string): boolean => nonJsRe.test(request)
 
 export function definePlugin(config: ResolvedConfig): Plugin {
   const isBuild = config.command === 'build'
+  const isWorker = config.isWorker
 
   const processNodeEnv: Record = {
     'process.env.NODE_ENV': JSON.stringify(process.env.NODE_ENV || config.mode),
@@ -40,7 +41,12 @@ export function definePlugin(config: ResolvedConfig): Plugin {
     Object.assign(importMetaKeys, {
       'import.meta.env.': `({}).`,
       'import.meta.env': JSON.stringify(config.env),
-      'import.meta.hot': `false`
+      'import.meta.hot': `false`,
+      ...(isWorker
+        ? {
+            'import.meta.url': 'self.location.href'
+          }
+        : {})
     })
   }
 

From 7f8dc58daa4a9f07c71d069ecf1f2b055521f23f Mon Sep 17 00:00:00 2001
From: toshify <4579559+toshify@users.noreply.github.com>
Date: Sun, 27 Mar 2022 11:49:17 +0200
Subject: [PATCH 05/70] fix: handle relative path glob raw import, fix #7307
 (#7371)

---
 .../glob-import/__tests__/glob-import.spec.ts | 12 ++++++++++++
 packages/playground/glob-import/index.html    | 19 +++++++++++++++++++
 packages/vite/src/node/importGlob.ts          |  2 +-
 3 files changed, 32 insertions(+), 1 deletion(-)

diff --git a/packages/playground/glob-import/__tests__/glob-import.spec.ts b/packages/playground/glob-import/__tests__/glob-import.spec.ts
index fff8d9fe202ebc..ebdf6c0ab29193 100644
--- a/packages/playground/glob-import/__tests__/glob-import.spec.ts
+++ b/packages/playground/glob-import/__tests__/glob-import.spec.ts
@@ -66,6 +66,12 @@ const rawResult = {
   }
 }
 
+const relativeRawResult = {
+  '../glob-import/dir/baz.json': {
+    msg: 'baz'
+  }
+}
+
 test('should work', async () => {
   expect(await page.textContent('.result')).toBe(
     JSON.stringify(allResult, null, 2)
@@ -81,6 +87,12 @@ test('import glob raw', async () => {
   )
 })
 
+test('import relative glob raw', async () => {
+  expect(await page.textContent('.relative-glob-raw')).toBe(
+    JSON.stringify(relativeRawResult, null, 2)
+  )
+})
+
 if (!isBuild) {
   test('hmr for adding/removing files', async () => {
     addFile('dir/a.js', '')
diff --git a/packages/playground/glob-import/index.html b/packages/playground/glob-import/index.html
index 52d41b817a169c..64f456aeb4d6a2 100644
--- a/packages/playground/glob-import/index.html
+++ b/packages/playground/glob-import/index.html
@@ -1,6 +1,7 @@
 

 

 

+

 
 
 
+
+
diff --git a/packages/vite/src/node/importGlob.ts b/packages/vite/src/node/importGlob.ts
index 8ed3ba66d09744..a759bee2b5fa59 100644
--- a/packages/vite/src/node/importGlob.ts
+++ b/packages/vite/src/node/importGlob.ts
@@ -147,7 +147,7 @@ export async function transformImportGlob(
         )
       }
       entries += ` ${JSON.stringify(file)}: ${JSON.stringify(
-        await fsp.readFile(path.join(base, file), 'utf-8')
+        await fsp.readFile(path.join(base, files[i]), 'utf-8')
       )},`
     } else {
       const importeeUrl = isCSSRequest(importee) ? `${importee}?used` : importee

From 42c15f6bad06f98962bc058c69a9f1e1a0f23440 Mon Sep 17 00:00:00 2001
From: "renovate[bot]" <29139614+renovate[bot]@users.noreply.github.com>
Date: Mon, 28 Mar 2022 05:10:21 +0200
Subject: [PATCH 06/70] chore(deps): update all non-major dependencies (#7490)

---
 package.json                      |  10 +-
 packages/create-vite/package.json |   2 +-
 packages/vite/package.json        |   6 +-
 pnpm-lock.yaml                    | 175 ++++++++++++++----------------
 4 files changed, 93 insertions(+), 100 deletions(-)

diff --git a/package.json b/package.json
index 858e7502d53324..878fd5c7de506f 100644
--- a/package.json
+++ b/package.json
@@ -45,26 +45,26 @@
     "conventional-changelog-cli": "^2.2.2",
     "cross-env": "^7.0.3",
     "esbuild": "^0.14.27",
-    "eslint": "^8.11.0",
+    "eslint": "^8.12.0",
     "eslint-define-config": "^1.3.0",
     "eslint-plugin-node": "^11.1.0",
     "execa": "^5.1.1",
     "fs-extra": "^10.0.1",
     "jest": "^27.5.1",
     "lint-staged": "^12.3.7",
-    "minimist": "^1.2.5",
+    "minimist": "^1.2.6",
     "node-fetch": "^2.6.6",
     "npm-run-all": "^4.1.5",
     "picocolors": "^1.0.0",
-    "playwright-chromium": "^1.20.0",
-    "prettier": "2.6.0",
+    "playwright-chromium": "^1.20.1",
+    "prettier": "2.6.1",
     "prompts": "^2.4.2",
     "rimraf": "^3.0.2",
     "rollup": "^2.59.0",
     "semver": "^7.3.5",
     "simple-git-hooks": "^2.7.0",
     "sirv": "^2.0.2",
-    "ts-jest": "^27.1.3",
+    "ts-jest": "^27.1.4",
     "ts-node": "^10.4.0",
     "typescript": "~4.5.4",
     "vite": "workspace:*",
diff --git a/packages/create-vite/package.json b/packages/create-vite/package.json
index 5d873b83fe515b..ec8199455ef86f 100644
--- a/packages/create-vite/package.json
+++ b/packages/create-vite/package.json
@@ -26,7 +26,7 @@
   "homepage": "https://github.com/vitejs/vite/tree/main/packages/create-vite#readme",
   "dependencies": {
     "kolorist": "^1.5.1",
-    "minimist": "^1.2.5",
+    "minimist": "^1.2.6",
     "prompts": "^2.4.2"
   }
 }
diff --git a/packages/vite/package.json b/packages/vite/package.json
index ddb89d3970fc26..f6c177b248289f 100644
--- a/packages/vite/package.json
+++ b/packages/vite/package.json
@@ -57,7 +57,7 @@
     "@babel/types": "^7.17.0",
     "@jridgewell/trace-mapping": "^0.3.4",
     "@rollup/plugin-alias": "^3.1.9",
-    "@rollup/plugin-commonjs": "^21.0.2",
+    "@rollup/plugin-commonjs": "^21.0.3",
     "@rollup/plugin-dynamic-import-vars": "^1.4.2",
     "@rollup/plugin-json": "^4.1.0",
     "@rollup/plugin-node-resolve": "13.1.3",
@@ -96,14 +96,14 @@
     "json5": "^2.2.1",
     "launch-editor-middleware": "^2.3.0",
     "magic-string": "^0.26.1",
-    "micromatch": "^4.0.4",
+    "micromatch": "^4.0.5",
     "mrmime": "^1.0.0",
     "node-forge": "^1.3.0",
     "okie": "^1.0.1",
     "open": "^8.4.0",
     "periscopic": "^2.0.3",
     "picocolors": "^1.0.0",
-    "postcss-import": "^14.0.2",
+    "postcss-import": "^14.1.0",
     "postcss-load-config": "^3.1.3",
     "postcss-modules": "^4.3.1",
     "resolve.exports": "^1.1.0",
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 22de761586a2f2..a09304a6c8f50d 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -19,26 +19,26 @@ importers:
       conventional-changelog-cli: ^2.2.2
       cross-env: ^7.0.3
       esbuild: ^0.14.27
-      eslint: ^8.11.0
+      eslint: ^8.12.0
       eslint-define-config: ^1.3.0
       eslint-plugin-node: ^11.1.0
       execa: ^5.1.1
       fs-extra: ^10.0.1
       jest: ^27.5.1
       lint-staged: ^12.3.7
-      minimist: ^1.2.5
+      minimist: ^1.2.6
       node-fetch: ^2.6.6
       npm-run-all: ^4.1.5
       picocolors: ^1.0.0
-      playwright-chromium: ^1.20.0
-      prettier: 2.6.0
+      playwright-chromium: ^1.20.1
+      prettier: 2.6.1
       prompts: ^2.4.2
       rimraf: ^3.0.2
       rollup: ^2.59.0
       semver: ^7.3.5
       simple-git-hooks: ^2.7.0
       sirv: ^2.0.2
-      ts-jest: ^27.1.3
+      ts-jest: ^27.1.4
       ts-node: ^10.4.0
       typescript: ~4.5.4
       vite: workspace:*
@@ -50,31 +50,31 @@ importers:
       '@types/node': 16.11.26
       '@types/prompts': 2.0.14
       '@types/semver': 7.3.9
-      '@typescript-eslint/eslint-plugin': 5.16.0_1324a086488ab25887f801dfb12f1aba
-      '@typescript-eslint/parser': 5.16.0_eslint@8.11.0+typescript@4.5.4
+      '@typescript-eslint/eslint-plugin': 5.16.0_e8f8f41828c0dd0ac8e32e1859a7f4f7
+      '@typescript-eslint/parser': 5.16.0_eslint@8.12.0+typescript@4.5.4
       conventional-changelog-cli: 2.2.2
       cross-env: 7.0.3
       esbuild: 0.14.27
-      eslint: 8.11.0
+      eslint: 8.12.0
       eslint-define-config: 1.3.0
-      eslint-plugin-node: 11.1.0_eslint@8.11.0
+      eslint-plugin-node: 11.1.0_eslint@8.12.0
       execa: 5.1.1
       fs-extra: 10.0.1
       jest: 27.5.1_ts-node@10.4.0
       lint-staged: 12.3.7
-      minimist: 1.2.5
+      minimist: 1.2.6
       node-fetch: 2.6.6
       npm-run-all: 4.1.5
       picocolors: 1.0.0
-      playwright-chromium: 1.20.0
-      prettier: 2.6.0
+      playwright-chromium: 1.20.1
+      prettier: 2.6.1
       prompts: 2.4.2
       rimraf: 3.0.2
       rollup: 2.62.0
       semver: 7.3.5
       simple-git-hooks: 2.7.0
       sirv: 2.0.2
-      ts-jest: 27.1.3_4dfe14e0e8266437469ae0475a5c09ac
+      ts-jest: 27.1.4_4dfe14e0e8266437469ae0475a5c09ac
       ts-node: 10.4.0_44ef5af6cbbc24239b4e70b5c7b0d7a6
       typescript: 4.5.4
       vite: link:packages/vite
@@ -83,11 +83,11 @@ importers:
   packages/create-vite:
     specifiers:
       kolorist: ^1.5.1
-      minimist: ^1.2.5
+      minimist: ^1.2.6
       prompts: ^2.4.2
     dependencies:
       kolorist: 1.5.1
-      minimist: 1.2.5
+      minimist: 1.2.6
       prompts: 2.4.2
 
   packages/playground:
@@ -809,7 +809,7 @@ importers:
       '@babel/types': ^7.17.0
       '@jridgewell/trace-mapping': ^0.3.4
       '@rollup/plugin-alias': ^3.1.9
-      '@rollup/plugin-commonjs': ^21.0.2
+      '@rollup/plugin-commonjs': ^21.0.3
       '@rollup/plugin-dynamic-import-vars': ^1.4.2
       '@rollup/plugin-json': ^4.1.0
       '@rollup/plugin-node-resolve': 13.1.3
@@ -850,7 +850,7 @@ importers:
       json5: ^2.2.1
       launch-editor-middleware: ^2.3.0
       magic-string: ^0.26.1
-      micromatch: ^4.0.4
+      micromatch: ^4.0.5
       mrmime: ^1.0.0
       node-forge: ^1.3.0
       okie: ^1.0.1
@@ -858,7 +858,7 @@ importers:
       periscopic: ^2.0.3
       picocolors: ^1.0.0
       postcss: ^8.4.12
-      postcss-import: ^14.0.2
+      postcss-import: ^14.1.0
       postcss-load-config: ^3.1.3
       postcss-modules: ^4.3.1
       resolve: ^1.22.0
@@ -887,7 +887,7 @@ importers:
       '@babel/types': 7.17.0
       '@jridgewell/trace-mapping': 0.3.4
       '@rollup/plugin-alias': 3.1.9_rollup@2.62.0
-      '@rollup/plugin-commonjs': 21.0.2_rollup@2.62.0
+      '@rollup/plugin-commonjs': 21.0.3_rollup@2.62.0
       '@rollup/plugin-dynamic-import-vars': 1.4.2_rollup@2.62.0
       '@rollup/plugin-json': 4.1.0_rollup@2.62.0
       '@rollup/plugin-node-resolve': 13.1.3_rollup@2.62.0
@@ -926,14 +926,14 @@ importers:
       json5: 2.2.1
       launch-editor-middleware: 2.3.0
       magic-string: 0.26.1
-      micromatch: 4.0.4
+      micromatch: 4.0.5
       mrmime: 1.0.0
       node-forge: 1.3.0
       okie: 1.0.1
       open: 8.4.0
       periscopic: 2.0.3
       picocolors: 1.0.0
-      postcss-import: 14.0.2_postcss@8.4.12
+      postcss-import: 14.1.0_postcss@8.4.12
       postcss-load-config: 3.1.3_ts-node@10.4.0
       postcss-modules: 4.3.1_postcss@8.4.12
       resolve.exports: 1.1.0
@@ -1112,7 +1112,7 @@ packages:
       convert-source-map: 1.8.0
       debug: 4.3.4
       gensync: 1.0.0-beta.2
-      json5: 2.2.0
+      json5: 2.2.1
       semver: 6.3.0
     transitivePeerDependencies:
       - supports-color
@@ -2165,17 +2165,6 @@ packages:
       - supports-color
     dev: true
 
-  /@jest/types/27.4.2:
-    resolution: {integrity: sha512-j35yw0PMTPpZsUoOBiuHzr1zTYoad1cVIE0ajEjcrJONxxrko/IRGKkXx3os0Nsi4Hu3+5VmDbVfq5WhG/pWAg==}
-    engines: {node: ^10.13.0 || ^12.13.0 || ^14.15.0 || >=15.0.0}
-    dependencies:
-      '@types/istanbul-lib-coverage': 2.0.4
-      '@types/istanbul-reports': 3.0.1
-      '@types/node': 16.11.26
-      '@types/yargs': 16.0.4
-      chalk: 4.1.2
-    dev: true
-
   /@jest/types/27.5.1:
     resolution: {integrity: sha512-Cx46iJ9QpwQTjIdq5VJu2QTMMs3QlEjI0x1QbBP5W1+nMzyc2XmimiRR/CbX9TO0cPTeUlxWMOu8mslYsJ8DEw==}
     engines: {node: ^10.13.0 || ^12.13.0 || ^14.15.0 || >=15.0.0}
@@ -2325,8 +2314,8 @@ packages:
       slash: 3.0.0
     dev: true
 
-  /@rollup/plugin-commonjs/21.0.2_rollup@2.62.0:
-    resolution: {integrity: sha512-d/OmjaLVO4j/aQX69bwpWPpbvI3TJkQuxoAk7BH8ew1PyoMBLTOuvJTjzG8oEoW7drIIqB0KCJtfFLu/2GClWg==}
+  /@rollup/plugin-commonjs/21.0.3_rollup@2.62.0:
+    resolution: {integrity: sha512-ThGfwyvcLc6cfP/MWxA5ACF+LZCvsuhUq7V5134Az1oQWsiC7lNpLT4mJI86WQunK7BYmpUiHmMk2Op6OAHs0g==}
     engines: {node: '>= 8.0.0'}
     peerDependencies:
       rollup: ^2.38.3
@@ -2698,7 +2687,7 @@ packages:
     dev: true
     optional: true
 
-  /@typescript-eslint/eslint-plugin/5.16.0_1324a086488ab25887f801dfb12f1aba:
+  /@typescript-eslint/eslint-plugin/5.16.0_e8f8f41828c0dd0ac8e32e1859a7f4f7:
     resolution: {integrity: sha512-SJoba1edXvQRMmNI505Uo4XmGbxCK9ARQpkvOd00anxzri9RNQk0DDCxD+LIl+jYhkzOJiOMMKYEHnHEODjdCw==}
     engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0}
     peerDependencies:
@@ -2709,12 +2698,12 @@ packages:
       typescript:
         optional: true
     dependencies:
-      '@typescript-eslint/parser': 5.16.0_eslint@8.11.0+typescript@4.5.4
+      '@typescript-eslint/parser': 5.16.0_eslint@8.12.0+typescript@4.5.4
       '@typescript-eslint/scope-manager': 5.16.0
-      '@typescript-eslint/type-utils': 5.16.0_eslint@8.11.0+typescript@4.5.4
-      '@typescript-eslint/utils': 5.16.0_eslint@8.11.0+typescript@4.5.4
+      '@typescript-eslint/type-utils': 5.16.0_eslint@8.12.0+typescript@4.5.4
+      '@typescript-eslint/utils': 5.16.0_eslint@8.12.0+typescript@4.5.4
       debug: 4.3.4
-      eslint: 8.11.0
+      eslint: 8.12.0
       functional-red-black-tree: 1.0.1
       ignore: 5.2.0
       regexpp: 3.2.0
@@ -2725,7 +2714,7 @@ packages:
       - supports-color
     dev: true
 
-  /@typescript-eslint/parser/5.16.0_eslint@8.11.0+typescript@4.5.4:
+  /@typescript-eslint/parser/5.16.0_eslint@8.12.0+typescript@4.5.4:
     resolution: {integrity: sha512-fkDq86F0zl8FicnJtdXakFs4lnuebH6ZADDw6CYQv0UZeIjHvmEw87m9/29nk2Dv5Lmdp0zQ3zDQhiMWQf/GbA==}
     engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0}
     peerDependencies:
@@ -2739,7 +2728,7 @@ packages:
       '@typescript-eslint/types': 5.16.0
       '@typescript-eslint/typescript-estree': 5.16.0_typescript@4.5.4
       debug: 4.3.4
-      eslint: 8.11.0
+      eslint: 8.12.0
       typescript: 4.5.4
     transitivePeerDependencies:
       - supports-color
@@ -2753,7 +2742,7 @@ packages:
       '@typescript-eslint/visitor-keys': 5.16.0
     dev: true
 
-  /@typescript-eslint/type-utils/5.16.0_eslint@8.11.0+typescript@4.5.4:
+  /@typescript-eslint/type-utils/5.16.0_eslint@8.12.0+typescript@4.5.4:
     resolution: {integrity: sha512-SKygICv54CCRl1Vq5ewwQUJV/8padIWvPgCxlWPGO/OgQLCijY9G7lDu6H+mqfQtbzDNlVjzVWQmeqbLMBLEwQ==}
     engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0}
     peerDependencies:
@@ -2763,9 +2752,9 @@ packages:
       typescript:
         optional: true
     dependencies:
-      '@typescript-eslint/utils': 5.16.0_eslint@8.11.0+typescript@4.5.4
+      '@typescript-eslint/utils': 5.16.0_eslint@8.12.0+typescript@4.5.4
       debug: 4.3.4
-      eslint: 8.11.0
+      eslint: 8.12.0
       tsutils: 3.21.0_typescript@4.5.4
       typescript: 4.5.4
     transitivePeerDependencies:
@@ -2798,7 +2787,7 @@ packages:
       - supports-color
     dev: true
 
-  /@typescript-eslint/utils/5.16.0_eslint@8.11.0+typescript@4.5.4:
+  /@typescript-eslint/utils/5.16.0_eslint@8.12.0+typescript@4.5.4:
     resolution: {integrity: sha512-iYej2ER6AwmejLWMWzJIHy3nPJeGDuCqf8Jnb+jAQVoPpmWzwQOfa9hWVB8GIQE5gsCv/rfN4T+AYb/V06WseQ==}
     engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0}
     peerDependencies:
@@ -2808,9 +2797,9 @@ packages:
       '@typescript-eslint/scope-manager': 5.16.0
       '@typescript-eslint/types': 5.16.0
       '@typescript-eslint/typescript-estree': 5.16.0_typescript@4.5.4
-      eslint: 8.11.0
+      eslint: 8.12.0
       eslint-scope: 5.1.1
-      eslint-utils: 3.0.0_eslint@8.11.0
+      eslint-utils: 3.0.0_eslint@8.12.0
     transitivePeerDependencies:
       - supports-color
       - typescript
@@ -3075,7 +3064,7 @@ packages:
     resolution: {integrity: sha512-RZNwNclF7+MS/8bDg70amg32dyeZGZxiDuQmZxKLAlQjr3jGyLx+4Kkk58UO7D2QdgFIQCovuSuZESne6RG6XQ==}
     engines: {node: '>= 6.0.0'}
     dependencies:
-      debug: 4.3.3
+      debug: 4.3.4
     transitivePeerDependencies:
       - supports-color
 
@@ -3158,7 +3147,7 @@ packages:
     engines: {node: '>= 8'}
     dependencies:
       normalize-path: 3.0.0
-      picomatch: 2.3.0
+      picomatch: 2.3.1
 
   /aproba/2.0.0:
     resolution: {integrity: sha512-lYe4Gx7QT+MKGbDsA+Z+he/Wtef0BiwDOlK/XkBrdfsh9J/jPPXbX0tE9x9cl27Tmu5gg3QUbUrQYa/y+KOHPQ==}
@@ -4177,7 +4166,6 @@ packages:
         optional: true
     dependencies:
       ms: 2.1.2
-    dev: true
 
   /debug/4.3.4_supports-color@9.2.1:
     resolution: {integrity: sha512-PRWFHuSU3eDtQJPvnNY7Jcket1j0t5OuOsFzPPzsekD52Zl8qUfFIPEiswXqIvHWGVHOgX+7G/vCNNhehwxfkQ==}
@@ -4700,25 +4688,25 @@ packages:
     engines: {node: '>= 16.9.0', npm: '>= 7.0.0', pnpm: '>= 6.32.2'}
     dev: true
 
-  /eslint-plugin-es/3.0.1_eslint@8.11.0:
+  /eslint-plugin-es/3.0.1_eslint@8.12.0:
     resolution: {integrity: sha512-GUmAsJaN4Fc7Gbtl8uOBlayo2DqhwWvEzykMHSCZHU3XdJ+NSzzZcVhXh3VxX5icqQ+oQdIEawXX8xkR3mIFmQ==}
     engines: {node: '>=8.10.0'}
     peerDependencies:
       eslint: '>=4.19.1'
     dependencies:
-      eslint: 8.11.0
+      eslint: 8.12.0
       eslint-utils: 2.1.0
       regexpp: 3.2.0
     dev: true
 
-  /eslint-plugin-node/11.1.0_eslint@8.11.0:
+  /eslint-plugin-node/11.1.0_eslint@8.12.0:
     resolution: {integrity: sha512-oUwtPJ1W0SKD0Tr+wqu92c5xuCeQqB3hSCHasn/ZgjFdA9iDGNkNf2Zi9ztY7X+hNuMib23LNGRm6+uN+KLE3g==}
     engines: {node: '>=8.10.0'}
     peerDependencies:
       eslint: '>=5.16.0'
     dependencies:
-      eslint: 8.11.0
-      eslint-plugin-es: 3.0.1_eslint@8.11.0
+      eslint: 8.12.0
+      eslint-plugin-es: 3.0.1_eslint@8.12.0
       eslint-utils: 2.1.0
       ignore: 5.2.0
       minimatch: 3.0.4
@@ -4749,13 +4737,13 @@ packages:
       eslint-visitor-keys: 1.3.0
     dev: true
 
-  /eslint-utils/3.0.0_eslint@8.11.0:
+  /eslint-utils/3.0.0_eslint@8.12.0:
     resolution: {integrity: sha512-uuQC43IGctw68pJA1RgbQS8/NP7rch6Cwd4j3ZBtgo4/8Flj4eGE7ZYSZRN3iq5pVUv6GPdW5Z1RFleo84uLDA==}
     engines: {node: ^10.0.0 || ^12.0.0 || >= 14.0.0}
     peerDependencies:
       eslint: '>=5'
     dependencies:
-      eslint: 8.11.0
+      eslint: 8.12.0
       eslint-visitor-keys: 2.1.0
     dev: true
 
@@ -4774,8 +4762,8 @@ packages:
     engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0}
     dev: true
 
-  /eslint/8.11.0:
-    resolution: {integrity: sha512-/KRpd9mIRg2raGxHRGwW9ZywYNAClZrHjdueHcrVDuO3a6bj83eoTirCCk0M0yPwOjWYKHwRVRid+xK4F/GHgA==}
+  /eslint/8.12.0:
+    resolution: {integrity: sha512-it1oBL9alZg1S8UycLm5YDMAkIhtH6FtAzuZs6YvoGVldWjbS08BkAdb/ymP9LlAyq8koANu32U7Ib/w+UNh8Q==}
     engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0}
     hasBin: true
     dependencies:
@@ -4784,11 +4772,11 @@ packages:
       ajv: 6.12.6
       chalk: 4.1.2
       cross-spawn: 7.0.3
-      debug: 4.3.3
+      debug: 4.3.4
       doctrine: 3.0.0
       escape-string-regexp: 4.0.0
       eslint-scope: 7.1.1
-      eslint-utils: 3.0.0_eslint@8.11.0
+      eslint-utils: 3.0.0_eslint@8.12.0
       eslint-visitor-keys: 3.3.0
       espree: 9.3.1
       esquery: 1.4.0
@@ -5338,7 +5326,7 @@ packages:
     engines: {node: '>=0.4.7'}
     hasBin: true
     dependencies:
-      minimist: 1.2.5
+      minimist: 1.2.6
       neo-async: 2.6.2
       source-map: 0.6.1
       wordwrap: 1.0.0
@@ -5495,7 +5483,7 @@ packages:
     engines: {node: '>= 6'}
     dependencies:
       agent-base: 6.0.2
-      debug: 4.3.3
+      debug: 4.3.4
     transitivePeerDependencies:
       - supports-color
 
@@ -6294,18 +6282,6 @@ packages:
       - supports-color
     dev: true
 
-  /jest-util/27.4.2:
-    resolution: {integrity: sha512-YuxxpXU6nlMan9qyLuxHaMMOzXAl5aGZWCSzben5DhLHemYQxCc4YK+4L3ZrCutT8GPQ+ui9k5D8rUJoDioMnA==}
-    engines: {node: ^10.13.0 || ^12.13.0 || ^14.15.0 || >=15.0.0}
-    dependencies:
-      '@jest/types': 27.4.2
-      '@types/node': 16.11.26
-      chalk: 4.1.2
-      ci-info: 3.3.0
-      graceful-fs: 4.2.9
-      picomatch: 2.3.0
-    dev: true
-
   /jest-util/27.5.1:
     resolution: {integrity: sha512-Kv2o/8jNvX1MQ0KGtw480E/w4fBCDOnH6+6DmeKi6LZUIlKA5kwY0YNdlzaWTiVgxqAqik11QyxDOKk543aKXw==}
     engines: {node: ^10.13.0 || ^12.13.0 || ^14.15.0 || >=15.0.0}
@@ -6475,6 +6451,7 @@ packages:
     hasBin: true
     dependencies:
       minimist: 1.2.5
+    dev: false
 
   /json5/2.2.1:
     resolution: {integrity: sha512-1hqLFMSrGHRHxav9q9gNjJ5EXznIxGVO09xQRrwplcS8qs28pZ8s8hupZAmqDwZUmVZ2Qb2jnyPOWcDH8m8dlA==}
@@ -6824,6 +6801,14 @@ packages:
       braces: 3.0.2
       picomatch: 2.3.0
 
+  /micromatch/4.0.5:
+    resolution: {integrity: sha512-DMy+ERcEW2q8Z2Po+WNXuw3c5YaUSFjAO5GsJqfEl7UjvtIuFKO6ZrKvcItdy98dwFI2N1tg3zNIdKaQT+aNdA==}
+    engines: {node: '>=8.6'}
+    dependencies:
+      braces: 3.0.2
+      picomatch: 2.3.1
+    dev: true
+
   /mime-db/1.46.0:
     resolution: {integrity: sha512-svXaP8UQRZ5K7or+ZmfNhg2xX3yKDMUzqadsSqi4NCH/KomcH75MAMYAGVlvXn4+b/xOPhS3I2uHKRUzvjY7BQ==}
     engines: {node: '>= 0.6'}
@@ -6937,6 +6922,10 @@ packages:
 
   /minimist/1.2.5:
     resolution: {integrity: sha512-FM9nNUYrRBAELZQT3xeZQ7fmMOBg6nWNmJKTcgsJeaLstP/UODVpGsr5OhXhhXg6f+qtJ8uiZ+PUxkDWcgIXLw==}
+    dev: false
+
+  /minimist/1.2.6:
+    resolution: {integrity: sha512-Jsjnk4bw3YJqYzbdyBiNsPWHPfO++UGG749Cxs6peCu5Xg4nrena6OVxOYxrQTqww0Jmwt+Ref8rggumkTLz9Q==}
 
   /minipass/3.1.6:
     resolution: {integrity: sha512-rty5kpw9/z8SX9dmxblFA6edItUmwJgMeYDZRrwlIVN27i8gysGbznJwUggw2V/FVqFSDdWy040ZPS811DYAqQ==}
@@ -7411,6 +7400,10 @@ packages:
     resolution: {integrity: sha512-lY1Q/PiJGC2zOv/z391WOTD+Z02bCgsFfvxoXXf6h7kv9o+WmsmzYqrAwY63sNgOxE4xEdq0WyUnXfKeBrSvYw==}
     engines: {node: '>=8.6'}
 
+  /picomatch/2.3.1:
+    resolution: {integrity: sha512-JU3teHTNjmE2VCGFzuY8EXzCDVwEqB2a8fsIvwaStHhAWJEeVd1o1QD80CU6+ZdEXXSLbSsuLwJjkCBWqRQUVA==}
+    engines: {node: '>=8.6'}
+
   /pidtree/0.3.1:
     resolution: {integrity: sha512-qQbW94hLHEqCg7nhby4yRC7G2+jYHY4Rguc2bjw7Uug4GIJuu1tvf2uHaZv5Q8zdt+WKJ6qK1FOI6amaWUo5FA==}
     engines: {node: '>=0.10'}
@@ -7458,21 +7451,21 @@ packages:
       find-up: 4.1.0
     dev: true
 
-  /playwright-chromium/1.20.0:
-    resolution: {integrity: sha512-5qyHaW2kFguX4eAne2MgS7AxZBfQ+hN2X0t5SD5mxOTAgwciEAhMNc06o9NxILnRcmF8QSXGg19OSb8VMUBLzg==}
+  /playwright-chromium/1.20.1:
+    resolution: {integrity: sha512-zDJm59GEOWrHqpByblzaKI+bpswd3nrheCoAGOTBDX7MsQYwAV/ZBS2aCJzeGxDt/67brq/fQuZse3GwnCk+6A==}
     engines: {node: '>=12'}
     hasBin: true
     requiresBuild: true
     dependencies:
-      playwright-core: 1.20.0
+      playwright-core: 1.20.1
     transitivePeerDependencies:
       - bufferutil
       - supports-color
       - utf-8-validate
     dev: true
 
-  /playwright-core/1.20.0:
-    resolution: {integrity: sha512-d25IRcdooS278Cijlp8J8A5fLQZ+/aY3dKRJvgX5yjXA69N0huIUdnh3xXSgn+LsQ9DCNmB7Ngof3eY630jgdA==}
+  /playwright-core/1.20.1:
+    resolution: {integrity: sha512-A8ZsZ09gaSbxP0UijoLyzp3LJc0kWMxDooLPi+mm4/5iYnTbd6PF5nKjoFw1a7KwjZIEgdhJduah4BcUIh+IPA==}
     engines: {node: '>=12'}
     hasBin: true
     dependencies:
@@ -7510,8 +7503,8 @@ packages:
     engines: {node: '>=12.13.0'}
     dev: true
 
-  /postcss-import/14.0.2_postcss@8.4.12:
-    resolution: {integrity: sha512-BJ2pVK4KhUyMcqjuKs9RijV5tatNzNa73e/32aBVE/ejYPe37iH+6vAu9WvqUkB5OAYgLHzbSvzHnorybJCm9g==}
+  /postcss-import/14.1.0_postcss@8.4.12:
+    resolution: {integrity: sha512-flwI+Vgm4SElObFVPpTIT7SU7R3qk2L7PyduMcokiaVKuWv9d/U+Gm/QAd8NDLuykTWTkcrjOeD2Pp1rMeBTGw==}
     engines: {node: '>=10.0.0'}
     peerDependencies:
       postcss: ^8.0.0
@@ -7668,8 +7661,8 @@ packages:
     engines: {node: '>= 0.8.0'}
     dev: true
 
-  /prettier/2.6.0:
-    resolution: {integrity: sha512-m2FgJibYrBGGgQXNzfd0PuDGShJgRavjUoRCw1mZERIWVSXF0iLzLm+aOqTAbLnC3n6JzUhAA8uZnFVghHJ86A==}
+  /prettier/2.6.1:
+    resolution: {integrity: sha512-8UVbTBYGwN37Bs9LERmxCPjdvPxlEowx2urIL6urHzdb3SDq4B/Z6xLFCblrSnE4iKWcS6ziJ3aOYrc1kz/E2A==}
     engines: {node: '>=10.13.0'}
     hasBin: true
     dev: true
@@ -8065,7 +8058,7 @@ packages:
     resolution: {integrity: sha512-hOS089on8RduqdbhvQ5Z37A0ESjsqz6qnRcffsMU3495FuTdqSm+7bhJ29JvIOsBDEEnan5DPu9t3To9VRlMzA==}
     engines: {node: '>=8.10.0'}
     dependencies:
-      picomatch: 2.3.0
+      picomatch: 2.3.1
 
   /redent/3.0.0:
     resolution: {integrity: sha512-6tDA8g98We0zd0GvVeMT9arEOnTw9qM03L9cJXaCjrip1OO764RDBLBfrB4cwzNGDj5OA5ioymC9GkizgWJDUg==}
@@ -9026,15 +9019,15 @@ packages:
       utf8-byte-length: 1.0.4
     dev: true
 
-  /ts-jest/27.1.3_4dfe14e0e8266437469ae0475a5c09ac:
-    resolution: {integrity: sha512-6Nlura7s6uM9BVUAoqLH7JHyMXjz8gluryjpPXxr3IxZdAXnU6FhjvVLHFtfd1vsE1p8zD1OJfskkc0jhTSnkA==}
+  /ts-jest/27.1.4_4dfe14e0e8266437469ae0475a5c09ac:
+    resolution: {integrity: sha512-qjkZlVPWVctAezwsOD1OPzbZ+k7zA5z3oxII4dGdZo5ggX/PL7kvwTM0pXTr10fAtbiVpJaL3bWd502zAhpgSQ==}
     engines: {node: ^10.13.0 || ^12.13.0 || ^14.15.0 || >=15.0.0}
     hasBin: true
     peerDependencies:
       '@babel/core': '>=7.0.0-beta.0 <8'
       '@types/jest': ^27.0.0
       babel-jest: '>=27.0.0 <28'
-      esbuild: ~0.14.0
+      esbuild: '*'
       jest: ^27.0.0
       typescript: '>=3.8 <5.0'
     peerDependenciesMeta:
@@ -9052,8 +9045,8 @@ packages:
       esbuild: 0.14.27
       fast-json-stable-stringify: 2.1.0
       jest: 27.5.1_ts-node@10.4.0
-      jest-util: 27.4.2
-      json5: 2.2.0
+      jest-util: 27.5.1
+      json5: 2.2.1
       lodash.memoize: 4.1.2
       make-error: 1.3.6
       semver: 7.3.5

From 9707f0e9e37e64eeb07fcd96d3e4fee6d19cc3a6 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E7=BF=A0=20/=20green?= 
Date: Mon, 28 Mar 2022 21:41:00 +0900
Subject: [PATCH 07/70] test: add js sourcemap tests (#7494)

---
 .../css-sourcemap/__tests__/serve.spec.ts     | 23 ++----
 .../playground/css-sourcemap/package.json     |  1 -
 .../js-sourcemap/__tests__/build.spec.ts      | 13 ++++
 .../js-sourcemap/__tests__/serve.spec.ts      | 44 +++++++++++
 packages/playground/js-sourcemap/bar.ts       |  1 +
 packages/playground/js-sourcemap/foo.js       |  1 +
 packages/playground/js-sourcemap/index.html   |  6 ++
 packages/playground/js-sourcemap/package.json | 11 +++
 .../playground/js-sourcemap/vite.config.js    |  8 ++
 packages/playground/package.json              |  1 +
 packages/playground/testUtils.ts              | 17 +++-
 packages/playground/vue-sourcemap/Js.vue      | 11 +++
 packages/playground/vue-sourcemap/Main.vue    |  4 +
 packages/playground/vue-sourcemap/Ts.vue      | 11 +++
 .../vue-sourcemap/__tests__/serve.spec.ts     | 78 +++++++++++++++----
 .../playground/vue-sourcemap/package.json     |  1 -
 pnpm-lock.yaml                                |  9 ++-
 17 files changed, 199 insertions(+), 41 deletions(-)
 create mode 100644 packages/playground/js-sourcemap/__tests__/build.spec.ts
 create mode 100644 packages/playground/js-sourcemap/__tests__/serve.spec.ts
 create mode 100644 packages/playground/js-sourcemap/bar.ts
 create mode 100644 packages/playground/js-sourcemap/foo.js
 create mode 100644 packages/playground/js-sourcemap/index.html
 create mode 100644 packages/playground/js-sourcemap/package.json
 create mode 100644 packages/playground/js-sourcemap/vite.config.js
 create mode 100644 packages/playground/vue-sourcemap/Js.vue
 create mode 100644 packages/playground/vue-sourcemap/Ts.vue

diff --git a/packages/playground/css-sourcemap/__tests__/serve.spec.ts b/packages/playground/css-sourcemap/__tests__/serve.spec.ts
index 0c6696b0dff7a2..11e33a78af8424 100644
--- a/packages/playground/css-sourcemap/__tests__/serve.spec.ts
+++ b/packages/playground/css-sourcemap/__tests__/serve.spec.ts
@@ -1,11 +1,11 @@
-import { fromComment } from 'convert-source-map'
 import { URL } from 'url'
-import { normalizePath } from 'vite'
-import { isBuild, testDir } from 'testUtils'
+import {
+  extractSourcemap,
+  formatSourcemapForSnapshot,
+  isBuild
+} from 'testUtils'
 
 if (!isBuild) {
-  const root = normalizePath(testDir)
-
   const getStyleTagContentIncluding = async (content: string) => {
     const styles = await page.$$('style')
     for (const style of styles) {
@@ -17,19 +17,6 @@ if (!isBuild) {
     throw new Error('Not found')
   }
 
-  const extractSourcemap = (content: string) => {
-    const lines = content.trim().split('\n')
-    return fromComment(lines[lines.length - 1]).toObject()
-  }
-
-  const formatSourcemapForSnapshot = (map: any) => {
-    const m = { ...map }
-    delete m.file
-    delete m.names
-    m.sources = m.sources.map((source) => source.replace(root, '/root'))
-    return m
-  }
-
   test('inline css', async () => {
     const css = await getStyleTagContentIncluding('.inline ')
     const map = extractSourcemap(css)
diff --git a/packages/playground/css-sourcemap/package.json b/packages/playground/css-sourcemap/package.json
index c29f18d4dee0d7..c7e9e61372cefa 100644
--- a/packages/playground/css-sourcemap/package.json
+++ b/packages/playground/css-sourcemap/package.json
@@ -9,7 +9,6 @@
     "preview": "vite preview"
   },
   "devDependencies": {
-    "convert-source-map": "^1.8.0",
     "less": "^4.1.2",
     "magic-string": "^0.25.7",
     "sass": "^1.43.4",
diff --git a/packages/playground/js-sourcemap/__tests__/build.spec.ts b/packages/playground/js-sourcemap/__tests__/build.spec.ts
new file mode 100644
index 00000000000000..e36c1f52d2c1f8
--- /dev/null
+++ b/packages/playground/js-sourcemap/__tests__/build.spec.ts
@@ -0,0 +1,13 @@
+import { isBuild } from 'testUtils'
+
+if (isBuild) {
+  test('should not output sourcemap warning (#4939)', () => {
+    serverLogs.forEach((log) => {
+      expect(log).not.toMatch('Sourcemap is likely to be incorrect')
+    })
+  })
+} else {
+  test('this file only includes test for build', () => {
+    expect(true).toBe(true)
+  })
+}
diff --git a/packages/playground/js-sourcemap/__tests__/serve.spec.ts b/packages/playground/js-sourcemap/__tests__/serve.spec.ts
new file mode 100644
index 00000000000000..a1ffdddc37ecd5
--- /dev/null
+++ b/packages/playground/js-sourcemap/__tests__/serve.spec.ts
@@ -0,0 +1,44 @@
+import { URL } from 'url'
+import {
+  extractSourcemap,
+  formatSourcemapForSnapshot,
+  isBuild
+} from 'testUtils'
+
+if (!isBuild) {
+  test('js', async () => {
+    const res = await page.request.get(new URL('./foo.js', page.url()).href)
+    const js = await res.text()
+    const lines = js.split('\n')
+    expect(lines[lines.length - 1].includes('//')).toBe(false) // expect no sourcemap
+  })
+
+  test('ts', async () => {
+    const res = await page.request.get(new URL('./bar.ts', page.url()).href)
+    const js = await res.text()
+    const map = extractSourcemap(js)
+    expect(formatSourcemapForSnapshot(map)).toMatchInlineSnapshot(`
+      Object {
+        "mappings": "AAAO,aAAM,MAAM;",
+        "sources": Array [
+          "/root/bar.ts",
+        ],
+        "sourcesContent": Array [
+          "export const bar = 'bar'
+      ",
+        ],
+        "version": 3,
+      }
+    `)
+  })
+
+  test('should not output missing source file warning', () => {
+    serverLogs.forEach((log) => {
+      expect(log).not.toMatch(/Sourcemap for .+ points to missing source files/)
+    })
+  })
+} else {
+  test('this file only includes test for serve', () => {
+    expect(true).toBe(true)
+  })
+}
diff --git a/packages/playground/js-sourcemap/bar.ts b/packages/playground/js-sourcemap/bar.ts
new file mode 100644
index 00000000000000..1fc11814f22e80
--- /dev/null
+++ b/packages/playground/js-sourcemap/bar.ts
@@ -0,0 +1 @@
+export const bar = 'bar'
diff --git a/packages/playground/js-sourcemap/foo.js b/packages/playground/js-sourcemap/foo.js
new file mode 100644
index 00000000000000..cb356468240d50
--- /dev/null
+++ b/packages/playground/js-sourcemap/foo.js
@@ -0,0 +1 @@
+export const foo = 'foo'
diff --git a/packages/playground/js-sourcemap/index.html b/packages/playground/js-sourcemap/index.html
new file mode 100644
index 00000000000000..025b161011a3fa
--- /dev/null
+++ b/packages/playground/js-sourcemap/index.html
@@ -0,0 +1,6 @@
+
+

JS Sourcemap

+
+ + + diff --git a/packages/playground/js-sourcemap/package.json b/packages/playground/js-sourcemap/package.json new file mode 100644 index 00000000000000..e5a97aea80830f --- /dev/null +++ b/packages/playground/js-sourcemap/package.json @@ -0,0 +1,11 @@ +{ + "name": "test-js-sourcemap", + "private": true, + "version": "0.0.0", + "scripts": { + "dev": "vite", + "build": "vite build", + "debug": "node --inspect-brk ../../vite/bin/vite", + "preview": "vite preview" + } +} diff --git a/packages/playground/js-sourcemap/vite.config.js b/packages/playground/js-sourcemap/vite.config.js new file mode 100644 index 00000000000000..bc9d1748cab964 --- /dev/null +++ b/packages/playground/js-sourcemap/vite.config.js @@ -0,0 +1,8 @@ +/** + * @type {import('vite').UserConfig} + */ +module.exports = { + build: { + sourcemap: true + } +} diff --git a/packages/playground/package.json b/packages/playground/package.json index 58ef368099e82f..75b1d15d299319 100644 --- a/packages/playground/package.json +++ b/packages/playground/package.json @@ -3,6 +3,7 @@ "private": true, "version": "1.0.0", "devDependencies": { + "convert-source-map": "^1.8.0", "css-color-names": "^1.0.1" } } diff --git a/packages/playground/testUtils.ts b/packages/playground/testUtils.ts index 0c8186d4ed121d..7d21625dacf874 100644 --- a/packages/playground/testUtils.ts +++ b/packages/playground/testUtils.ts @@ -6,7 +6,8 @@ import fs from 'fs' import path from 'path' import colors from 'css-color-names' import type { ElementHandle } from 'playwright-chromium' -import type { Manifest } from 'vite' +import { Manifest, normalizePath } from 'vite' +import { fromComment } from 'convert-source-map' export function slash(p: string): string { return p.replace(/\\/g, '/') @@ -138,3 +139,17 @@ export async function untilUpdated( * Send the rebuild complete message in build watch */ export { notifyRebuildComplete } from '../../scripts/jestPerTestSetup' + +export const extractSourcemap = (content: string) => { + const lines = content.trim().split('\n') + return fromComment(lines[lines.length - 1]).toObject() +} + +export const formatSourcemapForSnapshot = (map: any) => { + const root = normalizePath(testDir) + const m = { ...map } + delete m.file + delete m.names + m.sources = m.sources.map((source) => source.replace(root, '/root')) + return m +} diff --git a/packages/playground/vue-sourcemap/Js.vue b/packages/playground/vue-sourcemap/Js.vue new file mode 100644 index 00000000000000..3a5577099f67d3 --- /dev/null +++ b/packages/playground/vue-sourcemap/Js.vue @@ -0,0 +1,11 @@ + + + + + diff --git a/packages/playground/vue-sourcemap/Main.vue b/packages/playground/vue-sourcemap/Main.vue index 04ddf50071ccb3..b9b03596f5aea5 100644 --- a/packages/playground/vue-sourcemap/Main.vue +++ b/packages/playground/vue-sourcemap/Main.vue @@ -1,5 +1,7 @@ + + diff --git a/packages/playground/vue-sourcemap/__tests__/serve.spec.ts b/packages/playground/vue-sourcemap/__tests__/serve.spec.ts index 193b0afb9ba73f..08b4c04face111 100644 --- a/packages/playground/vue-sourcemap/__tests__/serve.spec.ts +++ b/packages/playground/vue-sourcemap/__tests__/serve.spec.ts @@ -1,10 +1,11 @@ -import { fromComment } from 'convert-source-map' -import { normalizePath } from 'vite' -import { isBuild, testDir } from 'testUtils' +import { + extractSourcemap, + formatSourcemapForSnapshot, + isBuild +} from 'testUtils' +import { URL } from 'url' if (!isBuild) { - const root = normalizePath(testDir) - const getStyleTagContentIncluding = async (content: string) => { const styles = await page.$$('style') for (const style of styles) { @@ -16,18 +17,63 @@ if (!isBuild) { throw new Error('Not found') } - const extractSourcemap = (content: string) => { - const lines = content.trim().split('\n') - return fromComment(lines[lines.length - 1]).toObject() - } + test('js', async () => { + const res = await page.request.get(new URL('./Js.vue', page.url()).href) + const js = await res.text() + const map = extractSourcemap(js) + expect(formatSourcemapForSnapshot(map)).toMatchInlineSnapshot(` + Object { + "mappings": "AAKA,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;;;;;AAGP;AACd,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;;;;;;;;;;;wBARlB,oBAAiB,WAAd,MAAU", + "sources": Array [ + "/root/Js.vue", + ], + "sourcesContent": Array [ + " - const formatSourcemapForSnapshot = (map: any) => { - const m = { ...map } - delete m.file - delete m.names - m.sources = m.sources.map((source) => source.replace(root, '/root')) - return m - } + + + + ", + ], + "version": 3, + } + `) + }) + + test('ts', async () => { + const res = await page.request.get(new URL('./Ts.vue', page.url()).href) + const js = await res.text() + const map = extractSourcemap(js) + expect(formatSourcemapForSnapshot(map)).toMatchInlineSnapshot(` + Object { + "mappings": ";AAKA,QAAQ,IAAI,WAAW;;;;AAIvB,YAAQ,IAAI,UAAU;;;;;;;;uBARpB,oBAAiB,WAAd,MAAU", + "sources": Array [ + "/root/Ts.vue", + ], + "sourcesContent": Array [ + " + + + + + ", + ], + "version": 3, + } + `) + }) test('css', async () => { const css = await getStyleTagContentIncluding('.css ') diff --git a/packages/playground/vue-sourcemap/package.json b/packages/playground/vue-sourcemap/package.json index 5672b5e3d9d57d..286940b01efa58 100644 --- a/packages/playground/vue-sourcemap/package.json +++ b/packages/playground/vue-sourcemap/package.json @@ -10,7 +10,6 @@ }, "devDependencies": { "@vitejs/plugin-vue": "workspace:*", - "convert-source-map": "^1.8.0", "less": "^4.1.2", "sass": "^1.43.4" }, diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index a09304a6c8f50d..def6f1a526907f 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -92,8 +92,10 @@ importers: packages/playground: specifiers: + convert-source-map: ^1.8.0 css-color-names: ^1.0.1 devDependencies: + convert-source-map: 1.8.0 css-color-names: 1.0.1 packages/playground/alias: @@ -152,13 +154,11 @@ importers: packages/playground/css-sourcemap: specifiers: - convert-source-map: ^1.8.0 less: ^4.1.2 magic-string: ^0.25.7 sass: ^1.43.4 stylus: ^0.55.0 devDependencies: - convert-source-map: 1.8.0 less: 4.1.2 magic-string: 0.25.7 sass: 1.45.1 @@ -223,6 +223,9 @@ importers: packages/playground/html: specifiers: {} + packages/playground/js-sourcemap: + specifiers: {} + packages/playground/json: specifiers: json-module: file:./json-module @@ -711,7 +714,6 @@ importers: packages/playground/vue-sourcemap: specifiers: '@vitejs/plugin-vue': workspace:* - convert-source-map: ^1.8.0 less: ^4.1.2 sass: ^1.43.4 vue: ^3.2.31 @@ -719,7 +721,6 @@ importers: vue: 3.2.31 devDependencies: '@vitejs/plugin-vue': link:../../plugin-vue - convert-source-map: 1.8.0 less: 4.1.2 sass: 1.45.1 From 01bc415289d747f2db048578ad23d1e995996301 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Fran=C3=A7ois=20Wouts?= Date: Tue, 29 Mar 2022 02:14:31 +1100 Subject: [PATCH 08/70] fix: add workaround to fix build-temp-types on Netlify (#7495) --- package.json | 7 +++++++ pnpm-lock.yaml | 9 +++++++-- 2 files changed, 14 insertions(+), 2 deletions(-) diff --git a/package.json b/package.json index 878fd5c7de506f..f6166c2985a30c 100644 --- a/package.json +++ b/package.json @@ -90,6 +90,13 @@ "overrides": { "vite": "workspace:*", "@vitejs/plugin-vue": "workspace:*" + }, + "packageExtensions": { + "postcss-load-config": { + "peerDependencies": { + "postcss": "*" + } + } } } } diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index def6f1a526907f..b0574f04c53b86 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -4,6 +4,8 @@ overrides: vite: workspace:* '@vitejs/plugin-vue': workspace:* +packageExtensionsChecksum: 696422bac84dd936748019990f84746e + importers: .: @@ -935,7 +937,7 @@ importers: periscopic: 2.0.3 picocolors: 1.0.0 postcss-import: 14.1.0_postcss@8.4.12 - postcss-load-config: 3.1.3_ts-node@10.4.0 + postcss-load-config: 3.1.3_postcss@8.4.12+ts-node@10.4.0 postcss-modules: 4.3.1_postcss@8.4.12 resolve.exports: 1.1.0 rollup-plugin-license: 2.6.1_rollup@2.62.0 @@ -7528,6 +7530,7 @@ packages: resolution: {integrity: sha512-ipM8Ds01ZUophjDTQYSVP70slFSYg3T0/zyfII5vzhN6V57YSxMgG5syXuwi5VtS8wSf3iL30v0uBdoIVx4Q0g==} engines: {node: '>= 10'} peerDependencies: + postcss: '*' ts-node: '>=9.0.0' peerDependenciesMeta: ts-node: @@ -7539,16 +7542,18 @@ packages: yaml: 1.10.2 dev: false - /postcss-load-config/3.1.3_ts-node@10.4.0: + /postcss-load-config/3.1.3_postcss@8.4.12+ts-node@10.4.0: resolution: {integrity: sha512-5EYgaM9auHGtO//ljHH+v/aC/TQ5LHXtL7bQajNAUBKUVKiYE8rYpFms7+V26D9FncaGe2zwCoPQsFKb5zF/Hw==} engines: {node: '>= 10'} peerDependencies: + postcss: '*' ts-node: '>=9.0.0' peerDependenciesMeta: ts-node: optional: true dependencies: lilconfig: 2.0.4 + postcss: 8.4.12 ts-node: 10.4.0_44ef5af6cbbc24239b4e70b5c7b0d7a6 yaml: 1.10.2 dev: true From 28b0660ee471828af0aa0bc29ca5b647fa51ef2e Mon Sep 17 00:00:00 2001 From: patak Date: Mon, 28 Mar 2022 17:18:45 +0200 Subject: [PATCH 09/70] fix: custom event payload type (#7498) --- packages/vite/types/customEvent.d.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/vite/types/customEvent.d.ts b/packages/vite/types/customEvent.d.ts index aacf1554b0de75..af4db5d14fbe97 100644 --- a/packages/vite/types/customEvent.d.ts +++ b/packages/vite/types/customEvent.d.ts @@ -13,4 +13,4 @@ export interface CustomEventMap { } export type InferCustomEventPayload = - T extends keyof CustomEventMap ? CustomEventMap[T] : unknown + T extends keyof CustomEventMap ? CustomEventMap[T] : any From 4ffd82d2d4759bc3efa368bca54613aaa1f45acc Mon Sep 17 00:00:00 2001 From: patak-dev Date: Mon, 28 Mar 2022 20:38:19 +0200 Subject: [PATCH 10/70] release: v2.9.0-beta.10 --- packages/vite/CHANGELOG.md | 13 +++++++++++++ packages/vite/package.json | 2 +- 2 files changed, 14 insertions(+), 1 deletion(-) diff --git a/packages/vite/CHANGELOG.md b/packages/vite/CHANGELOG.md index b79c75db3260f0..1a9b06abefcf66 100644 --- a/packages/vite/CHANGELOG.md +++ b/packages/vite/CHANGELOG.md @@ -1,3 +1,16 @@ +## 2.9.0-beta.10 (2022-03-28) + +* fix: Correctly process urls when they are rewritten to contain space (#7452) ([9ee2cf6](https://github.com/vitejs/vite/commit/9ee2cf6)), closes [#7452](https://github.com/vitejs/vite/issues/7452) +* fix: custom event payload type (#7498) ([28b0660](https://github.com/vitejs/vite/commit/28b0660)), closes [#7498](https://github.com/vitejs/vite/issues/7498) +* fix: handle relative path glob raw import, fix #7307 (#7371) ([7f8dc58](https://github.com/vitejs/vite/commit/7f8dc58)), closes [#7307](https://github.com/vitejs/vite/issues/7307) [#7371](https://github.com/vitejs/vite/issues/7371) +* fix: import.meta.url in worker (#7464) ([8ac4b12](https://github.com/vitejs/vite/commit/8ac4b12)), closes [#7464](https://github.com/vitejs/vite/issues/7464) +* fix: optimizeDeps.entries default ignore paths (#7469) ([4c95e99](https://github.com/vitejs/vite/commit/4c95e99)), closes [#7469](https://github.com/vitejs/vite/issues/7469) +* chore(deps): update all non-major dependencies (#7490) ([42c15f6](https://github.com/vitejs/vite/commit/42c15f6)), closes [#7490](https://github.com/vitejs/vite/issues/7490) +* feat(type): support typing for custom events (#7476) ([50a8765](https://github.com/vitejs/vite/commit/50a8765)), closes [#7476](https://github.com/vitejs/vite/issues/7476) +* refactor(types): share hot context type (#7475) ([64ddff0](https://github.com/vitejs/vite/commit/64ddff0)), closes [#7475](https://github.com/vitejs/vite/issues/7475) + + + ## 2.9.0-beta.9 (2022-03-26) * feat: support importing css with ?raw (#5796) ([fedb106](https://github.com/vitejs/vite/commit/fedb106)), closes [#5796](https://github.com/vitejs/vite/issues/5796) diff --git a/packages/vite/package.json b/packages/vite/package.json index f6c177b248289f..918b00aaa46912 100644 --- a/packages/vite/package.json +++ b/packages/vite/package.json @@ -1,6 +1,6 @@ { "name": "vite", - "version": "2.9.0-beta.9", + "version": "2.9.0-beta.10", "license": "MIT", "author": "Evan You", "description": "Native-ESM powered web dev build tool", From e3c7c7ace9da3d4c38e0ac49dd4b737cdd0c9f75 Mon Sep 17 00:00:00 2001 From: Johannes Maas Date: Tue, 29 Mar 2022 05:53:36 +0200 Subject: [PATCH 11/70] fix: build path error on Windows (#7383) --- packages/vite/src/node/plugins/html.ts | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) diff --git a/packages/vite/src/node/plugins/html.ts b/packages/vite/src/node/plugins/html.ts index 30e65a36f83bbe..5f7dae623b0cb4 100644 --- a/packages/vite/src/node/plugins/html.ts +++ b/packages/vite/src/node/plugins/html.ts @@ -594,7 +594,6 @@ export function buildHtmlPlugin(config: ResolvedConfig): Plugin { } } - const shortEmitName = path.posix.relative(config.root, id) // no use assets plugin because it will emit file let match: RegExpExecArray | null let s: MagicString | undefined @@ -612,8 +611,9 @@ export function buildHtmlPlugin(config: ResolvedConfig): Plugin { if (s) { result = s.toString() } + const relativeUrlPath = path.posix.relative(config.root, id) result = await applyHtmlTransforms(result, postHooks, { - path: '/' + shortEmitName, + path: '/' + relativeUrlPath, filename: id, bundle, chunk @@ -628,6 +628,7 @@ export function buildHtmlPlugin(config: ResolvedConfig): Plugin { delete bundle[chunk.fileName] } + const shortEmitName = path.relative(config.root, id) this.emitFile({ type: 'asset', fileName: shortEmitName, From 93ae8e5a053f637ff291a76cb0755e2c42cb5d8c Mon Sep 17 00:00:00 2001 From: Lukas Date: Tue, 29 Mar 2022 09:05:30 +0200 Subject: [PATCH 12/70] fix: infer client port from page location (#7463) --- docs/config/index.md | 4 +--- packages/vite/src/client/client.ts | 13 +++++++------ .../vite/src/node/plugins/clientInjections.ts | 19 +++++++++---------- packages/vite/src/node/server/hmr.ts | 2 +- 4 files changed, 18 insertions(+), 20 deletions(-) diff --git a/docs/config/index.md b/docs/config/index.md index a8d8cb36079f0a..f9a1a81dc77dbf 100644 --- a/docs/config/index.md +++ b/docs/config/index.md @@ -550,14 +550,12 @@ export default defineConfig(({ command, mode }) => { ### server.hmr -- **Type:** `boolean | { protocol?: string, host?: string, port?: number | false, path?: string, timeout?: number, overlay?: boolean, clientPort?: number, server?: Server }` +- **Type:** `boolean | { protocol?: string, host?: string, port?: number, path?: string, timeout?: number, overlay?: boolean, clientPort?: number, server?: Server }` Disable or configure HMR connection (in cases where the HMR websocket must use a different address from the http server). Set `server.hmr.overlay` to `false` to disable the server error overlay. - Set `server.hmr.port` to `false` when connecting to a domain without a port. - `clientPort` is an advanced option that overrides the port only on the client side, allowing you to serve the websocket on a different port than the client code looks for it on. Useful if you're using an SSL proxy in front of your dev server. If specifying `server.hmr.server`, Vite will process HMR connection requests through the provided server. If not in middleware mode, Vite will attempt to process HMR connection requests through the existing server. This can be helpful when using self-signed certificates or when you want to expose Vite over a network on a single port. diff --git a/packages/vite/src/client/client.ts b/packages/vite/src/client/client.ts index c180714f5a69bf..0f5929904a73c3 100644 --- a/packages/vite/src/client/client.ts +++ b/packages/vite/src/client/client.ts @@ -7,9 +7,10 @@ import '@vite/env' // injected by the hmr plugin when served declare const __BASE__: string -declare const __HMR_PROTOCOL__: string -declare const __HMR_HOSTNAME__: string -declare const __HMR_PORT__: string | false +declare const __HMR_PROTOCOL__: string | null +declare const __HMR_HOSTNAME__: string | null +declare const __HMR_PORT__: string | null +declare const __HMR_BASE__: string declare const __HMR_TIMEOUT__: number declare const __HMR_ENABLE_OVERLAY__: boolean @@ -18,9 +19,9 @@ console.log('[vite] connecting...') // use server configuration, then fallback to inference const socketProtocol = __HMR_PROTOCOL__ || (location.protocol === 'https:' ? 'wss' : 'ws') -const socketHost = __HMR_PORT__ - ? `${__HMR_HOSTNAME__ || location.hostname}:${__HMR_PORT__}` - : `${__HMR_HOSTNAME__ || location.hostname}` +const socketHost = `${__HMR_HOSTNAME__ || location.hostname}:${ + __HMR_PORT__ || location.port +}${__HMR_BASE__}` const socket = new WebSocket(`${socketProtocol}://${socketHost}`, 'vite-hmr') const base = __BASE__ || '/' diff --git a/packages/vite/src/node/plugins/clientInjections.ts b/packages/vite/src/node/plugins/clientInjections.ts index e86bec0826d72f..92a2ea93284eb1 100644 --- a/packages/vite/src/node/plugins/clientInjections.ts +++ b/packages/vite/src/node/plugins/clientInjections.ts @@ -2,7 +2,7 @@ import path from 'path' import type { Plugin } from '../plugin' import type { ResolvedConfig } from '../config' import { CLIENT_ENTRY, ENV_ENTRY } from '../constants' -import { normalizePath, isObject } from '../utils' +import { normalizePath } from '../utils' // ids in transform are normalized to unix style const normalizedClientEntry = normalizePath(CLIENT_ENTRY) @@ -23,21 +23,19 @@ export function clientInjectionsPlugin(config: ResolvedConfig): Plugin { const protocol = options.protocol || null const timeout = options.timeout || 30000 const overlay = options.overlay !== false - let port: number | string | false | undefined - if (isObject(config.server.hmr)) { - port = config.server.hmr.clientPort || config.server.hmr.port - } + let port: number | string | undefined | null + port = options.clientPort || options.port if (config.server.middlewareMode) { - port = String(port || 24678) - } else { - port = String(port || options.port || config.server.port!) + port = port || 24678 } + port = port ? String(port) : null + let hmrBase = config.base if (options.path) { hmrBase = path.posix.join(hmrBase, options.path) } - if (hmrBase !== '/') { - port = path.posix.normalize(`${port}${hmrBase}`) + if (hmrBase === '/') { + hmrBase = '' } return code @@ -47,6 +45,7 @@ export function clientInjectionsPlugin(config: ResolvedConfig): Plugin { .replace(/__HMR_PROTOCOL__/g, JSON.stringify(protocol)) .replace(/__HMR_HOSTNAME__/g, JSON.stringify(host)) .replace(/__HMR_PORT__/g, JSON.stringify(port)) + .replace(/__HMR_BASE__/g, JSON.stringify(hmrBase)) .replace(/__HMR_TIMEOUT__/g, JSON.stringify(timeout)) .replace(/__HMR_ENABLE_OVERLAY__/g, JSON.stringify(overlay)) } else if (!options?.ssr && code.includes('process.env.NODE_ENV')) { diff --git a/packages/vite/src/node/server/hmr.ts b/packages/vite/src/node/server/hmr.ts index edb73785247b6f..fc18b0aa91c5cb 100644 --- a/packages/vite/src/node/server/hmr.ts +++ b/packages/vite/src/node/server/hmr.ts @@ -18,7 +18,7 @@ const normalizedClientDir = normalizePath(CLIENT_DIR) export interface HmrOptions { protocol?: string host?: string - port?: number | false + port?: number clientPort?: number path?: string timeout?: number From b7cc0dcdf41c09c147356b0ecafa98b69491261c Mon Sep 17 00:00:00 2001 From: Bjorn Lu Date: Tue, 29 Mar 2022 15:10:23 +0800 Subject: [PATCH 13/70] docs: note url string must be static (#7508) --- docs/guide/assets.md | 9 +++++++-- 1 file changed, 7 insertions(+), 2 deletions(-) diff --git a/docs/guide/assets.md b/docs/guide/assets.md index fd5aa46f49467f..53ac153f9465bd 100644 --- a/docs/guide/assets.md +++ b/docs/guide/assets.md @@ -103,8 +103,13 @@ function getImageUrl(name) { } ``` -During the production build, Vite will perform necessary transforms so that the URLs still point to the correct location even after bundling and asset hashing. +During the production build, Vite will perform necessary transforms so that the URLs still point to the correct location even after bundling and asset hashing. However, the URL string must be static so it can be analyzed, otherwise the code will be left as is, which can cause runtime errors if `build.target` does not support `import.meta.url` -::: warning Note: Does not work with SSR +```js +// Vite will not transform this +const imgUrl = new URL(imagePath, import.meta.url).href +``` + +::: warning Does not work with SSR This pattern does not work if you are using Vite for Server-Side Rendering, because `import.meta.url` have different semantics in browsers vs. Node.js. The server bundle also cannot determine the client host URL ahead of time. ::: From 884e994b7322eb4ff96f457fe536affcd0b596d0 Mon Sep 17 00:00:00 2001 From: Bjorn Lu Date: Tue, 29 Mar 2022 15:15:51 +0800 Subject: [PATCH 14/70] docs: note env in command line (#7507) --- docs/guide/env-and-mode.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/guide/env-and-mode.md b/docs/guide/env-and-mode.md index d3a6a575bce64c..a2dee2b0d9d76e 100644 --- a/docs/guide/env-and-mode.md +++ b/docs/guide/env-and-mode.md @@ -37,7 +37,7 @@ Vite uses [dotenv](https://github.com/motdotla/dotenv) to load additional enviro An env file for a specific mode (e.g. `.env.production`) will take higher priority than a generic one (e.g. `.env`). -In addition, environment variables that already exist when Vite is executed have the highest priority and will not be overwritten by `.env` files. +In addition, environment variables that already exist when Vite is executed have the highest priority and will not be overwritten by `.env` files. For example, when running `VITE_SOME_KEY=123 vite build`. `.env` files are loaded at the start of Vite. Restart the server after making changes. ::: From 9ce673202d7cd3853710080f593241973c58d837 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E7=BF=A0=20/=20green?= Date: Tue, 29 Mar 2022 16:19:09 +0900 Subject: [PATCH 15/70] fix: import with query with exports/browser field (#7098) --- .../resolve/__tests__/resolve.spec.ts | 5 +- packages/playground/resolve/index.html | 3 +- packages/vite/src/node/plugins/resolve.ts | 48 +++++++++++-------- 3 files changed, 35 insertions(+), 21 deletions(-) diff --git a/packages/playground/resolve/__tests__/resolve.spec.ts b/packages/playground/resolve/__tests__/resolve.spec.ts index c8c85d8df9b806..2deb2fab7f8d40 100644 --- a/packages/playground/resolve/__tests__/resolve.spec.ts +++ b/packages/playground/resolve/__tests__/resolve.spec.ts @@ -17,7 +17,10 @@ test('deep import with exports field', async () => { }) test('deep import with query with exports field', async () => { - expect(await page.textContent('.exports-deep-query')).not.toMatch('fail') + // since it is imported with `?url` it should return a url + expect(await page.textContent('.exports-deep-query')).toMatch( + isBuild ? /base64/ : '/exports-path/deep.json' + ) }) test('deep import with exports field + exposed dir', async () => { diff --git a/packages/playground/resolve/index.html b/packages/playground/resolve/index.html index 2c4ed7b9aa760c..1920ebb675d24c 100644 --- a/packages/playground/resolve/index.html +++ b/packages/playground/resolve/index.html @@ -171,10 +171,11 @@

resolve package that contains # in path

import e from 'resolve-browser-field/ext-index/index.js' import f from 'resolve-browser-field/ext-index' import g from 'resolve-browser-field/no-ext-index/index.js' // no substitution + import h from 'resolve-browser-field/no-ext?query' import { ra, rb, rc, rd, re, rf, rg } from 'resolve-browser-field/relative' - const success = [main, a, c, d, e, f, ra, rc, rd, re, rf] + const success = [main, a, c, d, e, f, h, ra, rc, rd, re, rf] const noSuccess = [b, g, rb, rg] if ( diff --git a/packages/vite/src/node/plugins/resolve.ts b/packages/vite/src/node/plugins/resolve.ts index 686c08b12c3248..1b59503a9d43ed 100644 --- a/packages/vite/src/node/plugins/resolve.ts +++ b/packages/vite/src/node/plugins/resolve.ts @@ -332,23 +332,28 @@ export function resolvePlugin(baseOptions: InternalResolveOptions): Plugin { } } -function tryFsResolve( - fsPath: string, - options: InternalResolveOptions, - tryIndex = true, - targetWeb = true -): string | undefined { - let file = fsPath +function splitFileAndPostfix(path: string) { + let file = path let postfix = '' - let postfixIndex = fsPath.indexOf('?') + let postfixIndex = path.indexOf('?') if (postfixIndex < 0) { - postfixIndex = fsPath.indexOf('#') + postfixIndex = path.indexOf('#') } if (postfixIndex > 0) { - file = fsPath.slice(0, postfixIndex) - postfix = fsPath.slice(postfixIndex) + file = path.slice(0, postfixIndex) + postfix = path.slice(postfixIndex) } + return { file, postfix } +} + +function tryFsResolve( + fsPath: string, + options: InternalResolveOptions, + tryIndex = true, + targetWeb = true +): string | undefined { + const { file, postfix } = splitFileAndPostfix(fsPath) let res: string | undefined @@ -842,6 +847,7 @@ function resolveExports( if (options.conditions) { conditions.push(...options.conditions) } + return _resolveExports(pkg, key, { browser: targetWeb, require: options.isRequire, @@ -872,12 +878,14 @@ function resolveDeepImport( // map relative based on exports data if (exportsField) { if (isObject(exportsField) && !Array.isArray(exportsField)) { - relativeId = resolveExports( - data, - cleanUrl(relativeId), - options, - targetWeb - ) + // resolve without postfix (see #7098) + const { file, postfix } = splitFileAndPostfix(relativeId) + const exportsId = resolveExports(data, file, options, targetWeb) + if (exportsId !== undefined) { + relativeId = exportsId + postfix + } else { + relativeId = undefined + } } else { // not exposed relativeId = undefined @@ -889,9 +897,11 @@ function resolveDeepImport( ) } } else if (targetWeb && isObject(browserField)) { - const mapped = mapWithBrowserField(relativeId, browserField) + // resolve without postfix (see #7098) + const { file, postfix } = splitFileAndPostfix(relativeId) + const mapped = mapWithBrowserField(file, browserField) if (mapped) { - relativeId = mapped + relativeId = mapped + postfix } else if (mapped === false) { return (webResolvedImports[id] = browserExternalId) } From 2b7dad1ea1d78d7977e0569fcca4c585b4014e85 Mon Sep 17 00:00:00 2001 From: Artur Date: Tue, 29 Mar 2022 12:16:52 +0300 Subject: [PATCH 16/70] fix: make @fs URLs work with special characters (#7510) --- .../fs-serve/__tests__/fs-serve.spec.ts | 16 +++++++++++ .../playground/fs-serve/root/src/index.html | 28 +++++++++++++++++++ .../safe.json" | 3 ++ .../safe.txt" | 1 + .../src/node/server/middlewares/static.ts | 2 +- 5 files changed, 49 insertions(+), 1 deletion(-) create mode 100644 "packages/playground/fs-serve/root/src/special characters \303\245\303\244\303\266/safe.json" create mode 100644 "packages/playground/fs-serve/root/src/special characters \303\245\303\244\303\266/safe.txt" diff --git a/packages/playground/fs-serve/__tests__/fs-serve.spec.ts b/packages/playground/fs-serve/__tests__/fs-serve.spec.ts index c618186b9bcd64..eba1e441881710 100644 --- a/packages/playground/fs-serve/__tests__/fs-serve.spec.ts +++ b/packages/playground/fs-serve/__tests__/fs-serve.spec.ts @@ -23,6 +23,15 @@ describe('main', () => { expect(await page.textContent('.safe-fetch-status')).toBe('200') }) + test('safe fetch with special characters', async () => { + expect( + await page.textContent('.safe-fetch-subdir-special-characters') + ).toMatch('KEY=safe') + expect( + await page.textContent('.safe-fetch-subdir-special-characters-status') + ).toBe('200') + }) + test('unsafe fetch', async () => { expect(await page.textContent('.unsafe-fetch')).toMatch('403 Restricted') expect(await page.textContent('.unsafe-fetch-status')).toBe('403') @@ -33,6 +42,13 @@ describe('main', () => { expect(await page.textContent('.safe-fs-fetch-status')).toBe('200') }) + test('safe fs fetch with special characters', async () => { + expect(await page.textContent('.safe-fs-fetch-special-characters')).toBe( + stringified + ) + expect(await page.textContent('.safe-fs-fetch-status')).toBe('200') + }) + test('unsafe fs fetch', async () => { expect(await page.textContent('.unsafe-fs-fetch')).toBe('') expect(await page.textContent('.unsafe-fs-fetch-status')).toBe('403') diff --git a/packages/playground/fs-serve/root/src/index.html b/packages/playground/fs-serve/root/src/index.html index 9e4f728a593a91..951e14ad2cce91 100644 --- a/packages/playground/fs-serve/root/src/index.html +++ b/packages/playground/fs-serve/root/src/index.html @@ -11,6 +11,8 @@

Safe Fetch

Safe Fetch Subdirectory


 

+

+

 
 

Unsafe Fetch


@@ -19,6 +21,8 @@ 

Unsafe Fetch

Safe /@fs/ Fetch


 

+

+

 
 

Unsafe /@fs/ Fetch


@@ -56,6 +60,16 @@ 

Denied

text('.safe-fetch-subdir', JSON.stringify(data)) }) + // inside allowed dir, with special characters, safe fetch + fetch('/src/special%20characters%20%C3%A5%C3%A4%C3%B6/safe.txt') + .then((r) => { + text('.safe-fetch-subdir-special-characters-status', r.status) + return r.text() + }) + .then((data) => { + text('.safe-fetch-subdir-special-characters', JSON.stringify(data)) + }) + // outside of allowed dir, treated as unsafe fetch('/unsafe.txt') .then((r) => { @@ -92,6 +106,20 @@

Denied

console.error(e) }) + // not imported before, inside root with special characters, treated as safe + fetch( + '/@fs/' + + ROOT + + '/root/src/special%20characters%20%C3%A5%C3%A4%C3%B6/safe.json' + ) + .then((r) => { + text('.safe-fs-fetch-special-characters-status', r.status) + return r.json() + }) + .then((data) => { + text('.safe-fs-fetch-special-characters', JSON.stringify(data)) + }) + // .env, denied by default fetch('/@fs/' + ROOT + '/root/.env') .then((r) => { diff --git "a/packages/playground/fs-serve/root/src/special characters \303\245\303\244\303\266/safe.json" "b/packages/playground/fs-serve/root/src/special characters \303\245\303\244\303\266/safe.json" new file mode 100644 index 00000000000000..84f96593c10bad --- /dev/null +++ "b/packages/playground/fs-serve/root/src/special characters \303\245\303\244\303\266/safe.json" @@ -0,0 +1,3 @@ +{ + "msg": "safe" +} diff --git "a/packages/playground/fs-serve/root/src/special characters \303\245\303\244\303\266/safe.txt" "b/packages/playground/fs-serve/root/src/special characters \303\245\303\244\303\266/safe.txt" new file mode 100644 index 00000000000000..3f3d0607101642 --- /dev/null +++ "b/packages/playground/fs-serve/root/src/special characters \303\245\303\244\303\266/safe.txt" @@ -0,0 +1 @@ +KEY=safe diff --git a/packages/vite/src/node/server/middlewares/static.ts b/packages/vite/src/node/server/middlewares/static.ts index a6623338783cc8..5fb4f7fad2e055 100644 --- a/packages/vite/src/node/server/middlewares/static.ts +++ b/packages/vite/src/node/server/middlewares/static.ts @@ -111,7 +111,7 @@ export function serveRawFsMiddleware( // Keep the named function. The name is visible in debug logs via `DEBUG=connect:dispatcher ...` return function viteServeRawFsMiddleware(req, res, next) { - let url = req.url! + let url = decodeURI(req.url!) // In some cases (e.g. linked monorepos) files outside of root will // reference assets that are also out of served root. In such cases // the paths are rewritten to `/@fs/` prefixed paths and must be served by From 90df0bb7c610834f875dbfdb8dd3452f44f15627 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E7=BF=A0=20/=20green?= Date: Tue, 29 Mar 2022 20:08:34 +0900 Subject: [PATCH 17/70] fix: tailwind css sourcemap warning (#7480) --- .../__tests__/build.spec.ts | 13 ++++ .../__tests__/serve.spec.ts | 13 ++++ .../playground/tailwind-sourcemap/index.html | 9 +++ .../tailwind-sourcemap/package.json | 14 ++++ .../tailwind-sourcemap/postcss.config.js | 5 ++ .../tailwind-sourcemap/tailwind.config.js | 7 ++ .../tailwind-sourcemap/tailwind.css | 3 + .../tailwind-sourcemap/vite.config.js | 11 +++ packages/vite/src/node/plugins/css.ts | 30 ++++++-- pnpm-lock.yaml | 68 ++++++++++++++++++- 10 files changed, 164 insertions(+), 9 deletions(-) create mode 100644 packages/playground/tailwind-sourcemap/__tests__/build.spec.ts create mode 100644 packages/playground/tailwind-sourcemap/__tests__/serve.spec.ts create mode 100644 packages/playground/tailwind-sourcemap/index.html create mode 100644 packages/playground/tailwind-sourcemap/package.json create mode 100644 packages/playground/tailwind-sourcemap/postcss.config.js create mode 100644 packages/playground/tailwind-sourcemap/tailwind.config.js create mode 100644 packages/playground/tailwind-sourcemap/tailwind.css create mode 100644 packages/playground/tailwind-sourcemap/vite.config.js diff --git a/packages/playground/tailwind-sourcemap/__tests__/build.spec.ts b/packages/playground/tailwind-sourcemap/__tests__/build.spec.ts new file mode 100644 index 00000000000000..e36c1f52d2c1f8 --- /dev/null +++ b/packages/playground/tailwind-sourcemap/__tests__/build.spec.ts @@ -0,0 +1,13 @@ +import { isBuild } from 'testUtils' + +if (isBuild) { + test('should not output sourcemap warning (#4939)', () => { + serverLogs.forEach((log) => { + expect(log).not.toMatch('Sourcemap is likely to be incorrect') + }) + }) +} else { + test('this file only includes test for build', () => { + expect(true).toBe(true) + }) +} diff --git a/packages/playground/tailwind-sourcemap/__tests__/serve.spec.ts b/packages/playground/tailwind-sourcemap/__tests__/serve.spec.ts new file mode 100644 index 00000000000000..d961f75e4536e5 --- /dev/null +++ b/packages/playground/tailwind-sourcemap/__tests__/serve.spec.ts @@ -0,0 +1,13 @@ +import { isBuild } from 'testUtils' + +if (!isBuild) { + test('should not output missing source file warning', () => { + serverLogs.forEach((log) => { + expect(log).not.toMatch(/Sourcemap for .+ points to missing source files/) + }) + }) +} else { + test('this file only includes test for serve', () => { + expect(true).toBe(true) + }) +} diff --git a/packages/playground/tailwind-sourcemap/index.html b/packages/playground/tailwind-sourcemap/index.html new file mode 100644 index 00000000000000..95c8c5da7716d1 --- /dev/null +++ b/packages/playground/tailwind-sourcemap/index.html @@ -0,0 +1,9 @@ +
+

Tailwind Sourcemap

+ +

foo

+
+ + diff --git a/packages/playground/tailwind-sourcemap/package.json b/packages/playground/tailwind-sourcemap/package.json new file mode 100644 index 00000000000000..5c374f3bf47f1b --- /dev/null +++ b/packages/playground/tailwind-sourcemap/package.json @@ -0,0 +1,14 @@ +{ + "name": "test-tailwind-sourcemap", + "private": true, + "version": "0.0.0", + "scripts": { + "dev": "vite", + "build": "vite build", + "debug": "node --inspect-brk ../../vite/bin/vite", + "preview": "vite preview" + }, + "dependencies": { + "tailwindcss": "^3.0.23" + } +} diff --git a/packages/playground/tailwind-sourcemap/postcss.config.js b/packages/playground/tailwind-sourcemap/postcss.config.js new file mode 100644 index 00000000000000..eab3760cbc7b42 --- /dev/null +++ b/packages/playground/tailwind-sourcemap/postcss.config.js @@ -0,0 +1,5 @@ +module.exports = { + plugins: { + tailwindcss: { config: __dirname + '/tailwind.config.js' } + } +} diff --git a/packages/playground/tailwind-sourcemap/tailwind.config.js b/packages/playground/tailwind-sourcemap/tailwind.config.js new file mode 100644 index 00000000000000..f89a536ccd742f --- /dev/null +++ b/packages/playground/tailwind-sourcemap/tailwind.config.js @@ -0,0 +1,7 @@ +module.exports = { + content: ['./index.html'], + theme: { + extend: {} + }, + plugins: [] +} diff --git a/packages/playground/tailwind-sourcemap/tailwind.css b/packages/playground/tailwind-sourcemap/tailwind.css new file mode 100644 index 00000000000000..b5c61c956711f9 --- /dev/null +++ b/packages/playground/tailwind-sourcemap/tailwind.css @@ -0,0 +1,3 @@ +@tailwind base; +@tailwind components; +@tailwind utilities; diff --git a/packages/playground/tailwind-sourcemap/vite.config.js b/packages/playground/tailwind-sourcemap/vite.config.js new file mode 100644 index 00000000000000..70fea77247bcd4 --- /dev/null +++ b/packages/playground/tailwind-sourcemap/vite.config.js @@ -0,0 +1,11 @@ +/** + * @type {import('vite').UserConfig} + */ +module.exports = { + css: { + devSourcemap: true + }, + build: { + sourcemap: true + } +} diff --git a/packages/vite/src/node/plugins/css.ts b/packages/vite/src/node/plugins/css.ts index 4933f8455931c1..afd9e7849b7432 100644 --- a/packages/vite/src/node/plugins/css.ts +++ b/packages/vite/src/node/plugins/css.ts @@ -783,7 +783,9 @@ async function compileCSS( map: { inline: false, annotation: false, - sourcesContent: false + // postcss may return virtual files + // we cannot obtain content of them, so this needs to be enabled + sourcesContent: true // when "prev: preprocessorMap", the result map may include duplicate filename in `postcssResult.map.sources` // prev: preprocessorMap, } @@ -862,19 +864,33 @@ export function formatPostcssSourceMap( file: string ): ExistingRawSourceMap { const inputFileDir = path.dirname(file) - const sources = rawMap.sources + + const sources: string[] = [] + const sourcesContent: string[] = [] + for (const [i, source] of rawMap.sources.entries()) { // remove from sources, to prevent source map to be combined incorrectly - .filter((source) => source !== '') - .map((source) => { - const cleanSource = cleanUrl(decodeURIComponent(source)) - return normalizePath(path.resolve(inputFileDir, cleanSource)) - }) + if (source === '') continue + + const cleanSource = cleanUrl(decodeURIComponent(source)) + + // postcss returns virtual files + if (/^<.+>$/.test(cleanSource)) { + sources.push(`\0${cleanSource}`) + } else { + sources.push(normalizePath(path.resolve(inputFileDir, cleanSource))) + } + + if (rawMap.sourcesContent) { + sourcesContent.push(rawMap.sourcesContent[i]) + } + } return { file, mappings: rawMap.mappings, names: rawMap.names, sources, + sourcesContent, version: rawMap.version } } diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index b0574f04c53b86..461ca065e2e18d 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -666,6 +666,12 @@ importers: devDependencies: '@vitejs/plugin-vue': link:../../plugin-vue + packages/playground/tailwind-sourcemap: + specifiers: + tailwindcss: ^3.0.23 + dependencies: + tailwindcss: 3.0.23_ts-node@10.4.0 + packages/playground/tsconfig-json: specifiers: {} @@ -3553,7 +3559,6 @@ packages: readdirp: 3.6.0 optionalDependencies: fsevents: 2.3.2 - dev: true /chownr/2.0.0: resolution: {integrity: sha512-bIomtDF5KGpdogkLd9VspvFzk9KfpyyGlS8YFVZl7TGPBHL5snIOnxeshwVgPteQ9b4Eydl+pVbIyE1DcvCWgQ==} @@ -7526,6 +7531,16 @@ packages: postcss: 8.4.5 dev: false + /postcss-js/4.0.0_postcss@8.4.12: + resolution: {integrity: sha512-77QESFBwgX4irogGVPgQ5s07vLvFqWr228qZY+w6lW599cRlK/HmnlivnnVUxkjHnCu4J16PDMHcH+e+2HbvTQ==} + engines: {node: ^12 || ^14 || >= 16} + peerDependencies: + postcss: ^8.3.3 + dependencies: + camelcase-css: 2.0.1 + postcss: 8.4.12 + dev: false + /postcss-load-config/3.1.0_ts-node@10.4.0: resolution: {integrity: sha512-ipM8Ds01ZUophjDTQYSVP70slFSYg3T0/zyfII5vzhN6V57YSxMgG5syXuwi5VtS8wSf3iL30v0uBdoIVx4Q0g==} engines: {node: '>= 10'} @@ -7556,7 +7571,6 @@ packages: postcss: 8.4.12 ts-node: 10.4.0_44ef5af6cbbc24239b4e70b5c7b0d7a6 yaml: 1.10.2 - dev: true /postcss-modules-extract-imports/3.0.0_postcss@8.4.12: resolution: {integrity: sha512-bdHleFnP3kZ4NYDhuGlVK+CMrQ/pqUm8bx/oGL93K6gVwiclvX5x0n76fYMKuIGKzlABOy13zsvqjb0f92TEXw==} @@ -7623,6 +7637,16 @@ packages: dependencies: postcss-selector-parser: 6.0.8 + /postcss-nested/5.0.6_postcss@8.4.12: + resolution: {integrity: sha512-rKqm2Fk0KbA8Vt3AdGN0FB9OBOMDVajMG6ZCf/GoHgdxUJ4sBFp0A/uMIRm+MJUdo33YXEtjqIz8u7DAp8B7DA==} + engines: {node: '>=12.0'} + peerDependencies: + postcss: ^8.2.14 + dependencies: + postcss: 8.4.12 + postcss-selector-parser: 6.0.8 + dev: false + /postcss-selector-parser/6.0.8: resolution: {integrity: sha512-D5PG53d209Z1Uhcc0qAZ5U3t5HagH3cxu+WLZ22jt3gLUpXM4eXXfiO14jiDWST3NNooX/E8wISfOhZ9eIjGTQ==} engines: {node: '>=4'} @@ -7630,6 +7654,14 @@ packages: cssesc: 3.0.0 util-deprecate: 1.0.2 + /postcss-selector-parser/6.0.9: + resolution: {integrity: sha512-UO3SgnZOVTwu4kyLR22UQ1xZh086RyNZppb7lLAKBFK8a32ttG5i87Y/P3+2bRSjZNyJ1B7hfFNo273tKe9YxQ==} + engines: {node: '>=4'} + dependencies: + cssesc: 3.0.0 + util-deprecate: 1.0.2 + dev: false + /postcss-value-parser/3.3.1: resolution: {integrity: sha512-pISE66AbVkp4fDQ7VHBwRNXzAAKJjw4Vw7nWI/+Q3vuly7SNfgYXvm6i5IgFylHGK5sP/xHAbB7N49OS4gWNyQ==} dev: false @@ -8861,6 +8893,38 @@ packages: - ts-node dev: false + /tailwindcss/3.0.23_ts-node@10.4.0: + resolution: {integrity: sha512-+OZOV9ubyQ6oI2BXEhzw4HrqvgcARY38xv3zKcjnWtMIZstEsXdI9xftd1iB7+RbOnj2HOEzkA0OyB5BaSxPQA==} + engines: {node: '>=12.13.0'} + hasBin: true + peerDependencies: + autoprefixer: ^10.0.2 + dependencies: + arg: 5.0.1 + chalk: 4.1.2 + chokidar: 3.5.3 + color-name: 1.1.4 + cosmiconfig: 7.0.1 + detective: 5.2.0 + didyoumean: 1.2.2 + dlv: 1.1.3 + fast-glob: 3.2.11 + glob-parent: 6.0.2 + is-glob: 4.0.3 + normalize-path: 3.0.0 + object-hash: 2.2.0 + postcss: 8.4.12 + postcss-js: 4.0.0_postcss@8.4.12 + postcss-load-config: 3.1.3_postcss@8.4.12+ts-node@10.4.0 + postcss-nested: 5.0.6_postcss@8.4.12 + postcss-selector-parser: 6.0.9 + postcss-value-parser: 4.2.0 + quick-lru: 5.1.1 + resolve: 1.22.0 + transitivePeerDependencies: + - ts-node + dev: false + /tar/6.1.11: resolution: {integrity: sha512-an/KZQzQUkZCkuoAA64hM92X0Urb6VpRhAFllDzz44U2mcD5scmT3zBc4VgVpkugF580+DQn8eAFSyoQt0tznA==} engines: {node: '>= 10'} From 4d5521854c0b7213ec7d061dedd7f34e54919944 Mon Sep 17 00:00:00 2001 From: ygj6 <7699524+ygj6@users.noreply.github.com> Date: Tue, 29 Mar 2022 20:44:59 +0800 Subject: [PATCH 18/70] docs: declare the scope of define expressions (#7511) --- docs/config/index.md | 2 ++ 1 file changed, 2 insertions(+) diff --git a/docs/config/index.md b/docs/config/index.md index f9a1a81dc77dbf..9fc9273c691f56 100644 --- a/docs/config/index.md +++ b/docs/config/index.md @@ -156,6 +156,8 @@ export default defineConfig(({ command, mode }) => { - Starting from `2.0.0-beta.70`, string values will be used as raw expressions, so if defining a string constant, it needs to be explicitly quoted (e.g. with `JSON.stringify`). + - To be consistent with [esbuild behavior](https://esbuild.github.io/api/#define), expressions must either be a JSON object (null, boolean, number, string, array, or object) or a single identifier. + - Replacements are performed only when the match is surrounded by word boundaries (`\b`). ::: warning From 9481c7d1dca1155f73d21e913bd97ddd8d92a428 Mon Sep 17 00:00:00 2001 From: yoho Date: Tue, 29 Mar 2022 23:00:41 +0800 Subject: [PATCH 19/70] fix: worker match only run in js (#7500) --- packages/playground/vue/Main.vue | 3 ++- packages/playground/vue/__tests__/vue.spec.ts | 6 ++++++ packages/playground/vue/worker.vue | 17 +++++++++++++++++ packages/playground/vue/workerTest.js | 1 + packages/playground/worker/index.html | 5 +++++ packages/vite/src/node/build.ts | 2 -- .../src/node/plugins/assetImportMetaUrl.ts | 19 +++++++++++++++---- packages/vite/src/node/plugins/index.ts | 5 +++-- .../src/node/plugins/workerImportMetaUrl.ts | 16 +++++++++++++--- packages/vite/src/node/utils.ts | 1 + 10 files changed, 63 insertions(+), 12 deletions(-) create mode 100644 packages/playground/vue/worker.vue create mode 100644 packages/playground/vue/workerTest.js diff --git a/packages/playground/vue/Main.vue b/packages/playground/vue/Main.vue index d10ae401f7aa8e..87319acdf6f736 100644 --- a/packages/playground/vue/Main.vue +++ b/packages/playground/vue/Main.vue @@ -20,6 +20,7 @@ + diff --git a/packages/playground/vue/workerTest.js b/packages/playground/vue/workerTest.js new file mode 100644 index 00000000000000..fcde5e19b30677 --- /dev/null +++ b/packages/playground/vue/workerTest.js @@ -0,0 +1 @@ +self.postMessage('worker load!') diff --git a/packages/playground/worker/index.html b/packages/playground/worker/index.html index 60289ff84d6a06..fb4b3e9e85bfc8 100644 --- a/packages/playground/worker/index.html +++ b/packages/playground/worker/index.html @@ -1,3 +1,8 @@ +

worker template error match:

+ + const worker = new Worker(new URL('./worker.js', import.meta.url)) + +

format iife:

Expected values:
diff --git a/packages/vite/src/node/build.ts b/packages/vite/src/node/build.ts index 6b4d38836b6c51..d898b090fcdf6c 100644 --- a/packages/vite/src/node/build.ts +++ b/packages/vite/src/node/build.ts @@ -19,7 +19,6 @@ import type { } from 'rollup' import type Rollup from 'rollup' import { buildReporterPlugin } from './plugins/reporter' -import { buildHtmlPlugin } from './plugins/html' import { buildEsbuildPlugin } from './plugins/esbuild' import { terserPlugin } from './plugins/terser' import type { Terser } from 'types/terser' @@ -310,7 +309,6 @@ export function resolveBuildPlugins(config: ResolvedConfig): { return { pre: [ watchPackageDataPlugin(config), - buildHtmlPlugin(config), commonjsPlugin(options.commonjsOptions), dataURIPlugin(), dynamicImportVars(options.dynamicImportVarsOptions), diff --git a/packages/vite/src/node/plugins/assetImportMetaUrl.ts b/packages/vite/src/node/plugins/assetImportMetaUrl.ts index b0c59bed808604..a3f8e441b0f933 100644 --- a/packages/vite/src/node/plugins/assetImportMetaUrl.ts +++ b/packages/vite/src/node/plugins/assetImportMetaUrl.ts @@ -3,7 +3,12 @@ import MagicString from 'magic-string' import path from 'path' import { fileToUrl } from './asset' import type { ResolvedConfig } from '../config' -import { multilineCommentsRE, singlelineCommentsRE } from '../utils' +import { + multilineCommentsRE, + singlelineCommentsRE, + stringsRE, + blankReplacer +} from '../utils' /** * Convert `new URL('./foo.png', import.meta.url)` to its resolved built URL @@ -27,12 +32,18 @@ export function assetImportMetaUrlPlugin(config: ResolvedConfig): Plugin { const importMetaUrlRE = /\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)) + .replace(multilineCommentsRE, blankReplacer) + .replace(singlelineCommentsRE, blankReplacer) + .replace(stringsRE, (m) => `'${'\0'.repeat(m.length - 2)}'`) + let s: MagicString | null = null let match: RegExpExecArray | null while ((match = importMetaUrlRE.exec(noCommentsCode))) { - const { 0: exp, 1: rawUrl, index } = match + const { 0: exp, 1: emptyUrl, index } = match + + const urlStart = exp.indexOf(emptyUrl) + index + const urlEnd = urlStart + emptyUrl.length + const rawUrl = code.slice(urlStart, urlEnd) if (!s) s = new MagicString(code) diff --git a/packages/vite/src/node/plugins/index.ts b/packages/vite/src/node/plugins/index.ts index 825798a73c8493..d294233b92ae17 100644 --- a/packages/vite/src/node/plugins/index.ts +++ b/packages/vite/src/node/plugins/index.ts @@ -9,7 +9,7 @@ import { importAnalysisPlugin } from './importAnalysis' import { cssPlugin, cssPostPlugin } from './css' import { assetPlugin } from './asset' import { clientInjectionsPlugin } from './clientInjections' -import { htmlInlineProxyPlugin } from './html' +import { buildHtmlPlugin, htmlInlineProxyPlugin } from './html' import { wasmPlugin } from './wasm' import { modulePreloadPolyfillPlugin } from './modulePreloadPolyfill' import { webWorkerPlugin } from './worker' @@ -61,12 +61,13 @@ export async function resolvePlugins( ), wasmPlugin(config), webWorkerPlugin(config), - workerImportMetaUrlPlugin(config), assetPlugin(config), ...normalPlugins, definePlugin(config), cssPostPlugin(config), config.build.ssr ? ssrRequireHookPlugin(config) : null, + isBuild && buildHtmlPlugin(config), + workerImportMetaUrlPlugin(config), ...buildPlugins.pre, ...postPlugins, ...buildPlugins.post, diff --git a/packages/vite/src/node/plugins/workerImportMetaUrl.ts b/packages/vite/src/node/plugins/workerImportMetaUrl.ts index 233d83d066bcb7..4b5711cf3a6248 100644 --- a/packages/vite/src/node/plugins/workerImportMetaUrl.ts +++ b/packages/vite/src/node/plugins/workerImportMetaUrl.ts @@ -7,7 +7,8 @@ import { cleanUrl, injectQuery, multilineCommentsRE, - singlelineCommentsRE + singlelineCommentsRE, + stringsRE } from '../utils' import path from 'path' import { bundleWorkerEntry } from './worker' @@ -122,12 +123,21 @@ export function workerImportMetaUrlPlugin(config: ResolvedConfig): Plugin { const noCommentsCode = code .replace(multilineCommentsRE, blankReplacer) .replace(singlelineCommentsRE, blankReplacer) + + const noStringCode = noCommentsCode.replace( + stringsRE, + (m) => `'${' '.repeat(m.length - 2)}'` + ) let match: RegExpExecArray | null let s: MagicString | null = null - while ((match = importMetaUrlRE.exec(noCommentsCode))) { - const { 0: allExp, 2: exp, 3: rawUrl, index } = match + while ((match = importMetaUrlRE.exec(noStringCode))) { + const { 0: allExp, 2: exp, 3: emptyUrl, index } = match const urlIndex = allExp.indexOf(exp) + index + const urlStart = allExp.indexOf(emptyUrl) + index + const urlEnd = urlStart + emptyUrl.length + const rawUrl = code.slice(urlStart, urlEnd) + if (options?.ssr) { this.error( `\`new URL(url, import.meta.url)\` is not supported in SSR.`, diff --git a/packages/vite/src/node/utils.ts b/packages/vite/src/node/utils.ts index edb3410751868a..0e3fe49c9cb584 100644 --- a/packages/vite/src/node/utils.ts +++ b/packages/vite/src/node/utils.ts @@ -732,3 +732,4 @@ export function parseRequest(id: string): Record | null { } export const blankReplacer = (match: string) => ' '.repeat(match.length) +export const stringsRE = /"[^"]*"|'[^']*'|`[^`]*`/g From b16b8964e633cbf1ee2b051044af2660f1636558 Mon Sep 17 00:00:00 2001 From: Dany Castillo <31006608+dcastil@users.noreply.github.com> Date: Tue, 29 Mar 2022 18:05:54 +0200 Subject: [PATCH 20/70] docs: add wildcard to suggested .gitignore entry in docs (#7512) --- docs/guide/env-and-mode.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/guide/env-and-mode.md b/docs/guide/env-and-mode.md index a2dee2b0d9d76e..1649feda8c7501 100644 --- a/docs/guide/env-and-mode.md +++ b/docs/guide/env-and-mode.md @@ -57,7 +57,7 @@ If you want to customize env variables prefix, see [envPrefix](/config/index#env :::warning SECURITY NOTES -- `.env.*.local` files are local-only and can contain sensitive variables. You should add `.local` to your `.gitignore` to avoid them being checked into git. +- `.env.*.local` files are local-only and can contain sensitive variables. You should add `*.local` to your `.gitignore` to avoid them being checked into git. - Since any variables exposed to your Vite source code will end up in your client bundle, `VITE_*` variables should _not_ contain any sensitive information. ::: From f05a81387b6901622c86c2833f42420b8e18e95e Mon Sep 17 00:00:00 2001 From: yoho Date: Wed, 30 Mar 2022 00:11:54 +0800 Subject: [PATCH 21/70] fix: import url worker two times (#7468) --- .../worker/__tests__/es/es-worker.spec.ts | 4 +- .../worker/emit-chunk-nested-worker.js | 25 +++- .../worker/emit-chunk-sub-worker.js | 14 +- packages/playground/worker/index.html | 10 +- .../playground/worker/module-and-worker.js | 5 + .../worker/worker/main-format-es.js | 20 ++- .../playground/worker/worker/main-module.js | 1 + packages/vite/src/node/plugins/define.ts | 8 +- packages/vite/src/node/plugins/worker.ts | 127 +++++++++++++++--- .../src/node/plugins/workerImportMetaUrl.ts | 17 +-- 10 files changed, 181 insertions(+), 50 deletions(-) create mode 100644 packages/playground/worker/module-and-worker.js diff --git a/packages/playground/worker/__tests__/es/es-worker.spec.ts b/packages/playground/worker/__tests__/es/es-worker.spec.ts index 51497a0f5ebadd..c7fd0d6c19e4bc 100644 --- a/packages/playground/worker/__tests__/es/es-worker.spec.ts +++ b/packages/playground/worker/__tests__/es/es-worker.spec.ts @@ -60,7 +60,7 @@ if (isBuild) { // assert correct files test('inlined code generation', async () => { const files = fs.readdirSync(assetsDir) - expect(files.length).toBe(20) + expect(files.length).toBe(22) const index = files.find((f) => f.includes('main-module')) const content = fs.readFileSync(path.resolve(assetsDir, index), 'utf-8') const worker = files.find((f) => f.includes('my-worker')) @@ -94,7 +94,7 @@ test('classic worker', async () => { test('emit chunk', async () => { expect(await page.textContent('.emti-chunk-worker')).toMatch( - '{"msg1":"module1","msg2":"module2","msg3":"module3"}' + '["A string",{"type":"emit-chunk-sub-worker","data":"A string"},{"type":"module-and-worker:worker","data":"A string"},{"type":"module-and-worker:module","data":"module and worker"},{"type":"emit-chunk-sub-worker","data":{"module":"module and worker","msg1":"module1","msg2":"module2","msg3":"module3"}}]' ) expect(await page.textContent('.emti-chunk-dynamic-import-worker')).toMatch( '"A string/es/"' diff --git a/packages/playground/worker/emit-chunk-nested-worker.js b/packages/playground/worker/emit-chunk-nested-worker.js index dff0f5bc64c5ad..6cb72b9488cfaf 100644 --- a/packages/playground/worker/emit-chunk-nested-worker.js +++ b/packages/playground/worker/emit-chunk-nested-worker.js @@ -1,7 +1,28 @@ import SubWorker from './emit-chunk-sub-worker?worker' - const subWorker = new SubWorker() subWorker.onmessage = (event) => { - self.postMessage(event.data) + self.postMessage({ + type: 'emit-chunk-sub-worker', + data: event.data + }) } + +const moduleWorker = new Worker( + new URL('./module-and-worker.js', import.meta.url), + { type: 'module' } +) + +moduleWorker.onmessage = (event) => { + self.postMessage({ + type: 'module-and-worker:worker', + data: event.data + }) +} + +import('./module-and-worker').then((res) => { + self.postMessage({ + type: 'module-and-worker:module', + data: res.module + }) +}) diff --git a/packages/playground/worker/emit-chunk-sub-worker.js b/packages/playground/worker/emit-chunk-sub-worker.js index bd6b1f6e4f7419..5d20becc781dd7 100644 --- a/packages/playground/worker/emit-chunk-sub-worker.js +++ b/packages/playground/worker/emit-chunk-sub-worker.js @@ -1,6 +1,8 @@ -Promise.all([import('./modules/module2'), import('./modules/module3')]).then( - (data) => { - const _data = { ...data[0], ...data[1] } - self.postMessage(_data) - } -) +Promise.all([ + import('./module-and-worker'), + import('./modules/module2'), + import('./modules/module3') +]).then((data) => { + const _data = { ...data[0], ...data[1], ...data[2] } + self.postMessage(_data) +}) diff --git a/packages/playground/worker/index.html b/packages/playground/worker/index.html index fb4b3e9e85bfc8..aec3995b60a06e 100644 --- a/packages/playground/worker/index.html +++ b/packages/playground/worker/index.html @@ -62,7 +62,9 @@

format iife:

- worker emit chunk + worker emit chunk
+ module and worker:worker in worker file
+ module and worker:module in worker file
.emti-chunk-worker

@@ -73,6 +75,12 @@

+

+ module and worker:worker in simple file + .module-and-worker-worker +

+ + @@ -268,6 +272,12 @@

document.querySelector('.import-meta-url-img-comma-nl').src = metaUrlWithCommaNL + import classNames from './css/foo.module.css' + document.querySelector('#foo').className = classNames['foo-module'] + + import someString from './static/foo.txt?raw' + document.querySelector('.raw-query').textContent = someString + const metaUrlNonExistent = new URL('non-existent', import.meta.url).pathname text('.non-existent-import-meta-url', metaUrlNonExistent) diff --git a/packages/playground/assets/static/foo.txt b/packages/playground/assets/static/foo.txt new file mode 100644 index 00000000000000..19102815663d23 --- /dev/null +++ b/packages/playground/assets/static/foo.txt @@ -0,0 +1 @@ +foo \ No newline at end of file diff --git a/packages/vite/src/node/build.ts b/packages/vite/src/node/build.ts index 3541cc377dc411..ff03352a20d7a7 100644 --- a/packages/vite/src/node/build.ts +++ b/packages/vite/src/node/build.ts @@ -39,6 +39,7 @@ import { getDepsCacheDir, findKnownImports } from './optimizer' import { assetImportMetaUrlPlugin } from './plugins/assetImportMetaUrl' import { loadFallbackPlugin } from './plugins/loadFallback' import { watchPackageDataPlugin } from './packages' +import { ensureWatchPlugin } from './plugins/ensureWatch' export interface BuildOptions { /** @@ -308,6 +309,7 @@ export function resolveBuildPlugins(config: ResolvedConfig): { return { pre: [ + ...(options.watch ? [ensureWatchPlugin()] : []), watchPackageDataPlugin(config), commonjsPlugin(options.commonjsOptions), dataURIPlugin(), diff --git a/packages/vite/src/node/plugins/ensureWatch.ts b/packages/vite/src/node/plugins/ensureWatch.ts new file mode 100644 index 00000000000000..30a6fb3d6df819 --- /dev/null +++ b/packages/vite/src/node/plugins/ensureWatch.ts @@ -0,0 +1,17 @@ +import type { Plugin } from '../plugin' +import { cleanUrl, queryRE } from '../utils' + +/** + * plugin to ensure rollup can watch correctly. + */ +export function ensureWatchPlugin(): Plugin { + return { + name: 'vite:ensure-watch', + load(id) { + if (queryRE.test(id)) { + this.addWatchFile(cleanUrl(id)) + } + return null + } + } +} diff --git a/packages/vite/src/node/plugins/index.ts b/packages/vite/src/node/plugins/index.ts index d294233b92ae17..2d34b99aebf1c5 100644 --- a/packages/vite/src/node/plugins/index.ts +++ b/packages/vite/src/node/plugins/index.ts @@ -17,6 +17,7 @@ import { preAliasPlugin } from './preAlias' import { definePlugin } from './define' import { ssrRequireHookPlugin } from './ssrRequireHook' import { workerImportMetaUrlPlugin } from './workerImportMetaUrl' +import { ensureWatchPlugin } from './ensureWatch' import { metadataPlugin } from './metadata' export async function resolvePlugins( @@ -26,12 +27,14 @@ export async function resolvePlugins( postPlugins: Plugin[] ): Promise { const isBuild = config.command === 'build' + const isWatch = isBuild && !!config.build.watch const buildPlugins = isBuild ? (await import('../build')).resolveBuildPlugins(config) : { pre: [], post: [] } return [ + isWatch ? ensureWatchPlugin() : null, isBuild ? metadataPlugin() : null, isBuild ? null : preAliasPlugin(), aliasPlugin({ entries: config.resolve.alias }), diff --git a/scripts/jestPerTestSetup.ts b/scripts/jestPerTestSetup.ts index 150c02eed5b76c..fcdca77ee9a6eb 100644 --- a/scripts/jestPerTestSetup.ts +++ b/scripts/jestPerTestSetup.ts @@ -175,6 +175,7 @@ afterAll(async () => { global.serverLogs = [] await global.page?.close() await server?.close() + global.watcher?.close() const beforeAllErr = getBeforeAllError() if (beforeAllErr) { throw beforeAllErr @@ -200,7 +201,7 @@ function startStaticServer(config?: InlineConfig): Promise { } // start static file server - const serve = sirv(resolve(rootDir, 'dist')) + const serve = sirv(resolve(rootDir, 'dist'), { dev: !!config?.build?.watch }) const httpServer = (server = http.createServer((req, res) => { if (req.url === '/ping') { res.statusCode = 200 From dfce28355c42d38425bc3374ed944ac324f50882 Mon Sep 17 00:00:00 2001 From: yoho Date: Tue, 12 Apr 2022 02:59:02 +0800 Subject: [PATCH 70/70] feat: clean string module lex string template (#7667) --- .../src/node/__tests__/cleanString.spec.ts | 52 ++++++++ packages/vite/src/node/cleanString.ts | 113 +++++++++++++++++- 2 files changed, 164 insertions(+), 1 deletion(-) diff --git a/packages/vite/src/node/__tests__/cleanString.spec.ts b/packages/vite/src/node/__tests__/cleanString.spec.ts index 883dc67abfe2f9..1065a2d4985ceb 100644 --- a/packages/vite/src/node/__tests__/cleanString.spec.ts +++ b/packages/vite/src/node/__tests__/cleanString.spec.ts @@ -106,3 +106,55 @@ test('find empty string flag in raw index', () => { const bStart = clean.indexOf('\0\0\0\0\0', bIndex) expect(str.slice(bStart, bStart + 5)).toMatch('bbbbb') }) + +test('template string nested', () => { + let str = '`aaaa`' + let res = '`\0\0\0\0`' + let clean = emptyString(str) + expect(clean).toMatch(res) + + str = '`aaaa` `aaaa`' + res = '`\0\0\0\0` `\0\0\0\0`' + clean = emptyString(str) + expect(clean).toMatch(res) + + str = '`aa${a}aa`' + res = '`\0\0${a}\0\0`' + clean = emptyString(str) + expect(clean).toMatch(res) + + str = '`aa${a + `a` + a}aa`' + res = '`\0\0${a + `\0` + a}\0\0`' + clean = emptyString(str) + expect(clean).toMatch(res) + + str = '`aa${a + `a` + a}aa` `aa${a + `a` + a}aa`' + res = '`\0\0${a + `\0` + a}\0\0` `\0\0${a + `\0` + a}\0\0`' + clean = emptyString(str) + expect(clean).toMatch(res) + + str = '`aa${a + `aaaa${c + (a = {b: 1}) + d}` + a}aa`' + res = '`\0\0${a + `\0\0\0\0${c + (a = {b: 1}) + d}` + a}\0\0`' + clean = emptyString(str) + expect(clean).toMatch(res) + + str = + '`aa${a + `aaaa${c + (a = {b: 1}) + d}` + a}aa` `aa${a + `aaaa${c + (a = {b: 1}) + d}` + a}aa`' + res = + '`\0\0${a + `\0\0\0\0${c + (a = {b: 1}) + d}` + a}\0\0` `\0\0${a + `\0\0\0\0${c + (a = {b: 1}) + d}` + a}\0\0`' + clean = emptyString(str) + expect(clean).toMatch(res) + + str = '`aaaa' + res = '' + try { + clean = emptyString(str) + } catch {} + expect(clean).toMatch(res) + + str = + "" + res = `` + clean = emptyString(str) + expect(clean).toMatch(res) +}) diff --git a/packages/vite/src/node/cleanString.ts b/packages/vite/src/node/cleanString.ts index d26274397124ff..05163ea055b631 100644 --- a/packages/vite/src/node/cleanString.ts +++ b/packages/vite/src/node/cleanString.ts @@ -1,3 +1,4 @@ +import type { RollupError } from 'rollup' // bank on the non-overlapping nature of regex matches and combine all filters into one giant regex // /`([^`\$\{\}]|\$\{(`|\g<1>)*\})*`/g can match nested string template // but js not support match expression(\g<0>). so clean string template(`...`) in other ways. @@ -8,7 +9,117 @@ const stringBlankReplacer = (s: string) => `${s[0]}${'\0'.repeat(s.length - 2)}${s[0]}` export function emptyString(raw: string): string { - return raw.replace(cleanerRE, (s: string) => + let res = raw.replace(cleanerRE, (s: string) => s[0] === '/' ? blankReplacer(s) : stringBlankReplacer(s) ) + + let lastEnd = 0 + let start = 0 + while ((start = res.indexOf('`', lastEnd)) >= 0) { + let clean + ;[clean, lastEnd] = lexStringTemplateExpression(res, start) + res = replaceAt(res, start, lastEnd, clean) + } + + return res +} + +const enum LexerState { + inTemplateString, + inInterpolationExpression, + inObjectExpression +} + +function replaceAt( + string: string, + start: number, + end: number, + replacement: string +): string { + return string.slice(0, start) + replacement + string.slice(end) +} + +/** + * lex string template and clean it. + */ +function lexStringTemplateExpression( + code: string, + start: number +): [string, number] { + let state = LexerState.inTemplateString as LexerState + let clean = '`' + const opStack: LexerState[] = [state] + + function pushStack(newState: LexerState) { + state = newState + opStack.push(state) + } + + function popStack() { + opStack.pop() + state = opStack[opStack.length - 1] + } + + let i = start + 1 + outer: for (; i < code.length; i++) { + const char = code.charAt(i) + switch (state) { + case LexerState.inTemplateString: + if (char === '$' && code.charAt(i + 1) === '{') { + pushStack(LexerState.inInterpolationExpression) + clean += '${' + i++ // jump next + } else if (char === '`') { + popStack() + clean += char + if (opStack.length === 0) { + break outer + } + } else { + clean += '\0' + } + break + case LexerState.inInterpolationExpression: + if (char === '{') { + pushStack(LexerState.inObjectExpression) + clean += char + } else if (char === '}') { + popStack() + clean += char + } else if (char === '`') { + pushStack(LexerState.inTemplateString) + clean += char + } else { + clean += char + } + break + case LexerState.inObjectExpression: + if (char === '}') { + popStack() + clean += char + } else if (char === '`') { + pushStack(LexerState.inTemplateString) + clean += char + } else { + clean += char + } + break + default: + throw new Error('unknown string template lexer state') + } + } + + if (opStack.length !== 0) { + error(start) + } + + return [clean, i + 1] +} + +function error(pos: number) { + const err = new Error( + `can not match string template expression.` + ) as RollupError + err.pos = pos + throw err }