mirror of
https://github.com/vitejs/vite.git
synced 2024-11-21 14:48:41 +00:00
fix: allow tree-shake glob eager css in js (#9547)
This commit is contained in:
翠 / green
GitHub
parent
27a20a5fd0
commit
2e309d6dfe
@ -2,43 +2,43 @@
|
||||
|
||||
exports[`fixture > transform 1`] = `
|
||||
"import * as __vite_glob_1_0 from \\"./modules/a.ts\\";import * as __vite_glob_1_1 from \\"./modules/b.ts\\";import * as __vite_glob_1_2 from \\"./modules/index.ts\\";import { name as __vite_glob_3_0 } from \\"./modules/a.ts\\";import { name as __vite_glob_3_1 } from \\"./modules/b.ts\\";import { name as __vite_glob_3_2 } from \\"./modules/index.ts\\";import { default as __vite_glob_5_0 } from \\"./modules/a.ts?raw\\";import { default as __vite_glob_5_1 } from \\"./modules/b.ts?raw\\";import \\"../../../../../../types/importMeta\\";
|
||||
export const basic = Object.assign({\\"./modules/a.ts\\": () => import(\\"./modules/a.ts\\"),\\"./modules/b.ts\\": () => import(\\"./modules/b.ts\\"),\\"./modules/index.ts\\": () => import(\\"./modules/index.ts\\")});
|
||||
export const basicEager = Object.assign({\\"./modules/a.ts\\": __vite_glob_1_0,\\"./modules/b.ts\\": __vite_glob_1_1,\\"./modules/index.ts\\": __vite_glob_1_2});
|
||||
export const ignore = Object.assign({\\"./modules/a.ts\\": () => import(\\"./modules/a.ts\\"),\\"./modules/b.ts\\": () => import(\\"./modules/b.ts\\")});
|
||||
export const namedEager = Object.assign({\\"./modules/a.ts\\": __vite_glob_3_0,\\"./modules/b.ts\\": __vite_glob_3_1,\\"./modules/index.ts\\": __vite_glob_3_2});
|
||||
export const namedDefault = Object.assign({\\"./modules/a.ts\\": () => import(\\"./modules/a.ts\\").then(m => m[\\"default\\"]),\\"./modules/b.ts\\": () => import(\\"./modules/b.ts\\").then(m => m[\\"default\\"]),\\"./modules/index.ts\\": () => import(\\"./modules/index.ts\\").then(m => m[\\"default\\"])});
|
||||
export const eagerAs = Object.assign({\\"./modules/a.ts\\": __vite_glob_5_0,\\"./modules/b.ts\\": __vite_glob_5_1});
|
||||
export const rawImportModule = Object.assign({\\"./modules/a.ts\\": () => import(\\"./modules/a.ts?raw\\"),\\"./modules/b.ts\\": () => import(\\"./modules/b.ts?raw\\")});
|
||||
export const excludeSelf = Object.assign({\\"./sibling.ts\\": () => import(\\"./sibling.ts\\")});
|
||||
export const customQueryString = Object.assign({\\"./sibling.ts\\": () => import(\\"./sibling.ts?custom\\")});
|
||||
export const customQueryObject = Object.assign({\\"./sibling.ts\\": () => import(\\"./sibling.ts?foo=bar&raw=true\\")});
|
||||
export const parent = Object.assign({});
|
||||
export const rootMixedRelative = Object.assign({\\"/css.spec.ts\\": () => import(\\"../../css.spec.ts?url\\").then(m => m[\\"default\\"]),\\"/define.spec.ts\\": () => import(\\"../../define.spec.ts?url\\").then(m => m[\\"default\\"]),\\"/esbuild.spec.ts\\": () => import(\\"../../esbuild.spec.ts?url\\").then(m => m[\\"default\\"]),\\"/import.spec.ts\\": () => import(\\"../../import.spec.ts?url\\").then(m => m[\\"default\\"]),\\"/importGlob/fixture-b/a.ts\\": () => import(\\"../fixture-b/a.ts?url\\").then(m => m[\\"default\\"]),\\"/importGlob/fixture-b/b.ts\\": () => import(\\"../fixture-b/b.ts?url\\").then(m => m[\\"default\\"]),\\"/importGlob/fixture-b/index.ts\\": () => import(\\"../fixture-b/index.ts?url\\").then(m => m[\\"default\\"])});
|
||||
export const cleverCwd1 = Object.assign({\\"./node_modules/framework/pages/hello.page.js\\": () => import(\\"./node_modules/framework/pages/hello.page.js\\")});
|
||||
export const cleverCwd2 = Object.assign({\\"./modules/a.ts\\": () => import(\\"./modules/a.ts\\"),\\"./modules/b.ts\\": () => import(\\"./modules/b.ts\\"),\\"../fixture-b/a.ts\\": () => import(\\"../fixture-b/a.ts\\"),\\"../fixture-b/b.ts\\": () => import(\\"../fixture-b/b.ts\\")});
|
||||
export const basic = /* #__PURE__ */ Object.assign({\\"./modules/a.ts\\": () => import(\\"./modules/a.ts\\"),\\"./modules/b.ts\\": () => import(\\"./modules/b.ts\\"),\\"./modules/index.ts\\": () => import(\\"./modules/index.ts\\")});
|
||||
export const basicEager = /* #__PURE__ */ Object.assign({\\"./modules/a.ts\\": __vite_glob_1_0,\\"./modules/b.ts\\": __vite_glob_1_1,\\"./modules/index.ts\\": __vite_glob_1_2});
|
||||
export const ignore = /* #__PURE__ */ Object.assign({\\"./modules/a.ts\\": () => import(\\"./modules/a.ts\\"),\\"./modules/b.ts\\": () => import(\\"./modules/b.ts\\")});
|
||||
export const namedEager = /* #__PURE__ */ Object.assign({\\"./modules/a.ts\\": __vite_glob_3_0,\\"./modules/b.ts\\": __vite_glob_3_1,\\"./modules/index.ts\\": __vite_glob_3_2});
|
||||
export const namedDefault = /* #__PURE__ */ Object.assign({\\"./modules/a.ts\\": () => import(\\"./modules/a.ts\\").then(m => m[\\"default\\"]),\\"./modules/b.ts\\": () => import(\\"./modules/b.ts\\").then(m => m[\\"default\\"]),\\"./modules/index.ts\\": () => import(\\"./modules/index.ts\\").then(m => m[\\"default\\"])});
|
||||
export const eagerAs = /* #__PURE__ */ Object.assign({\\"./modules/a.ts\\": __vite_glob_5_0,\\"./modules/b.ts\\": __vite_glob_5_1});
|
||||
export const rawImportModule = /* #__PURE__ */ Object.assign({\\"./modules/a.ts\\": () => import(\\"./modules/a.ts?raw\\"),\\"./modules/b.ts\\": () => import(\\"./modules/b.ts?raw\\")});
|
||||
export const excludeSelf = /* #__PURE__ */ Object.assign({\\"./sibling.ts\\": () => import(\\"./sibling.ts\\")});
|
||||
export const customQueryString = /* #__PURE__ */ Object.assign({\\"./sibling.ts\\": () => import(\\"./sibling.ts?custom\\")});
|
||||
export const customQueryObject = /* #__PURE__ */ Object.assign({\\"./sibling.ts\\": () => import(\\"./sibling.ts?foo=bar&raw=true\\")});
|
||||
export const parent = /* #__PURE__ */ Object.assign({});
|
||||
export const rootMixedRelative = /* #__PURE__ */ Object.assign({\\"/css.spec.ts\\": () => import(\\"../../css.spec.ts?url\\").then(m => m[\\"default\\"]),\\"/define.spec.ts\\": () => import(\\"../../define.spec.ts?url\\").then(m => m[\\"default\\"]),\\"/esbuild.spec.ts\\": () => import(\\"../../esbuild.spec.ts?url\\").then(m => m[\\"default\\"]),\\"/import.spec.ts\\": () => import(\\"../../import.spec.ts?url\\").then(m => m[\\"default\\"]),\\"/importGlob/fixture-b/a.ts\\": () => import(\\"../fixture-b/a.ts?url\\").then(m => m[\\"default\\"]),\\"/importGlob/fixture-b/b.ts\\": () => import(\\"../fixture-b/b.ts?url\\").then(m => m[\\"default\\"]),\\"/importGlob/fixture-b/index.ts\\": () => import(\\"../fixture-b/index.ts?url\\").then(m => m[\\"default\\"])});
|
||||
export const cleverCwd1 = /* #__PURE__ */ Object.assign({\\"./node_modules/framework/pages/hello.page.js\\": () => import(\\"./node_modules/framework/pages/hello.page.js\\")});
|
||||
export const cleverCwd2 = /* #__PURE__ */ Object.assign({\\"./modules/a.ts\\": () => import(\\"./modules/a.ts\\"),\\"./modules/b.ts\\": () => import(\\"./modules/b.ts\\"),\\"../fixture-b/a.ts\\": () => import(\\"../fixture-b/a.ts\\"),\\"../fixture-b/b.ts\\": () => import(\\"../fixture-b/b.ts\\")});
|
||||
"
|
||||
`;
|
||||
|
||||
exports[`fixture > transform with restoreQueryExtension 1`] = `
|
||||
"import * as __vite_glob_1_0 from \\"./modules/a.ts\\";import * as __vite_glob_1_1 from \\"./modules/b.ts\\";import * as __vite_glob_1_2 from \\"./modules/index.ts\\";import { name as __vite_glob_3_0 } from \\"./modules/a.ts\\";import { name as __vite_glob_3_1 } from \\"./modules/b.ts\\";import { name as __vite_glob_3_2 } from \\"./modules/index.ts\\";import { default as __vite_glob_5_0 } from \\"./modules/a.ts?raw\\";import { default as __vite_glob_5_1 } from \\"./modules/b.ts?raw\\";import \\"../../../../../../types/importMeta\\";
|
||||
export const basic = Object.assign({\\"./modules/a.ts\\": () => import(\\"./modules/a.ts\\"),\\"./modules/b.ts\\": () => import(\\"./modules/b.ts\\"),\\"./modules/index.ts\\": () => import(\\"./modules/index.ts\\")});
|
||||
export const basicEager = Object.assign({\\"./modules/a.ts\\": __vite_glob_1_0,\\"./modules/b.ts\\": __vite_glob_1_1,\\"./modules/index.ts\\": __vite_glob_1_2});
|
||||
export const ignore = Object.assign({\\"./modules/a.ts\\": () => import(\\"./modules/a.ts\\"),\\"./modules/b.ts\\": () => import(\\"./modules/b.ts\\")});
|
||||
export const namedEager = Object.assign({\\"./modules/a.ts\\": __vite_glob_3_0,\\"./modules/b.ts\\": __vite_glob_3_1,\\"./modules/index.ts\\": __vite_glob_3_2});
|
||||
export const namedDefault = Object.assign({\\"./modules/a.ts\\": () => import(\\"./modules/a.ts\\").then(m => m[\\"default\\"]),\\"./modules/b.ts\\": () => import(\\"./modules/b.ts\\").then(m => m[\\"default\\"]),\\"./modules/index.ts\\": () => import(\\"./modules/index.ts\\").then(m => m[\\"default\\"])});
|
||||
export const eagerAs = Object.assign({\\"./modules/a.ts\\": __vite_glob_5_0,\\"./modules/b.ts\\": __vite_glob_5_1});
|
||||
export const rawImportModule = Object.assign({\\"./modules/a.ts\\": () => import(\\"./modules/a.ts?raw\\"),\\"./modules/b.ts\\": () => import(\\"./modules/b.ts?raw\\")});
|
||||
export const excludeSelf = Object.assign({\\"./sibling.ts\\": () => import(\\"./sibling.ts\\")});
|
||||
export const customQueryString = Object.assign({\\"./sibling.ts\\": () => import(\\"./sibling.ts?custom&lang.ts\\")});
|
||||
export const customQueryObject = Object.assign({\\"./sibling.ts\\": () => import(\\"./sibling.ts?foo=bar&raw=true&lang.ts\\")});
|
||||
export const parent = Object.assign({});
|
||||
export const rootMixedRelative = Object.assign({\\"/css.spec.ts\\": () => import(\\"../../css.spec.ts?url&lang.ts\\").then(m => m[\\"default\\"]),\\"/define.spec.ts\\": () => import(\\"../../define.spec.ts?url&lang.ts\\").then(m => m[\\"default\\"]),\\"/esbuild.spec.ts\\": () => import(\\"../../esbuild.spec.ts?url&lang.ts\\").then(m => m[\\"default\\"]),\\"/import.spec.ts\\": () => import(\\"../../import.spec.ts?url&lang.ts\\").then(m => m[\\"default\\"]),\\"/importGlob/fixture-b/a.ts\\": () => import(\\"../fixture-b/a.ts?url&lang.ts\\").then(m => m[\\"default\\"]),\\"/importGlob/fixture-b/b.ts\\": () => import(\\"../fixture-b/b.ts?url&lang.ts\\").then(m => m[\\"default\\"]),\\"/importGlob/fixture-b/index.ts\\": () => import(\\"../fixture-b/index.ts?url&lang.ts\\").then(m => m[\\"default\\"])});
|
||||
export const cleverCwd1 = Object.assign({\\"./node_modules/framework/pages/hello.page.js\\": () => import(\\"./node_modules/framework/pages/hello.page.js\\")});
|
||||
export const cleverCwd2 = Object.assign({\\"./modules/a.ts\\": () => import(\\"./modules/a.ts\\"),\\"./modules/b.ts\\": () => import(\\"./modules/b.ts\\"),\\"../fixture-b/a.ts\\": () => import(\\"../fixture-b/a.ts\\"),\\"../fixture-b/b.ts\\": () => import(\\"../fixture-b/b.ts\\")});
|
||||
export const basic = /* #__PURE__ */ Object.assign({\\"./modules/a.ts\\": () => import(\\"./modules/a.ts\\"),\\"./modules/b.ts\\": () => import(\\"./modules/b.ts\\"),\\"./modules/index.ts\\": () => import(\\"./modules/index.ts\\")});
|
||||
export const basicEager = /* #__PURE__ */ Object.assign({\\"./modules/a.ts\\": __vite_glob_1_0,\\"./modules/b.ts\\": __vite_glob_1_1,\\"./modules/index.ts\\": __vite_glob_1_2});
|
||||
export const ignore = /* #__PURE__ */ Object.assign({\\"./modules/a.ts\\": () => import(\\"./modules/a.ts\\"),\\"./modules/b.ts\\": () => import(\\"./modules/b.ts\\")});
|
||||
export const namedEager = /* #__PURE__ */ Object.assign({\\"./modules/a.ts\\": __vite_glob_3_0,\\"./modules/b.ts\\": __vite_glob_3_1,\\"./modules/index.ts\\": __vite_glob_3_2});
|
||||
export const namedDefault = /* #__PURE__ */ Object.assign({\\"./modules/a.ts\\": () => import(\\"./modules/a.ts\\").then(m => m[\\"default\\"]),\\"./modules/b.ts\\": () => import(\\"./modules/b.ts\\").then(m => m[\\"default\\"]),\\"./modules/index.ts\\": () => import(\\"./modules/index.ts\\").then(m => m[\\"default\\"])});
|
||||
export const eagerAs = /* #__PURE__ */ Object.assign({\\"./modules/a.ts\\": __vite_glob_5_0,\\"./modules/b.ts\\": __vite_glob_5_1});
|
||||
export const rawImportModule = /* #__PURE__ */ Object.assign({\\"./modules/a.ts\\": () => import(\\"./modules/a.ts?raw\\"),\\"./modules/b.ts\\": () => import(\\"./modules/b.ts?raw\\")});
|
||||
export const excludeSelf = /* #__PURE__ */ Object.assign({\\"./sibling.ts\\": () => import(\\"./sibling.ts\\")});
|
||||
export const customQueryString = /* #__PURE__ */ Object.assign({\\"./sibling.ts\\": () => import(\\"./sibling.ts?custom&lang.ts\\")});
|
||||
export const customQueryObject = /* #__PURE__ */ Object.assign({\\"./sibling.ts\\": () => import(\\"./sibling.ts?foo=bar&raw=true&lang.ts\\")});
|
||||
export const parent = /* #__PURE__ */ Object.assign({});
|
||||
export const rootMixedRelative = /* #__PURE__ */ Object.assign({\\"/css.spec.ts\\": () => import(\\"../../css.spec.ts?url&lang.ts\\").then(m => m[\\"default\\"]),\\"/define.spec.ts\\": () => import(\\"../../define.spec.ts?url&lang.ts\\").then(m => m[\\"default\\"]),\\"/esbuild.spec.ts\\": () => import(\\"../../esbuild.spec.ts?url&lang.ts\\").then(m => m[\\"default\\"]),\\"/import.spec.ts\\": () => import(\\"../../import.spec.ts?url&lang.ts\\").then(m => m[\\"default\\"]),\\"/importGlob/fixture-b/a.ts\\": () => import(\\"../fixture-b/a.ts?url&lang.ts\\").then(m => m[\\"default\\"]),\\"/importGlob/fixture-b/b.ts\\": () => import(\\"../fixture-b/b.ts?url&lang.ts\\").then(m => m[\\"default\\"]),\\"/importGlob/fixture-b/index.ts\\": () => import(\\"../fixture-b/index.ts?url&lang.ts\\").then(m => m[\\"default\\"])});
|
||||
export const cleverCwd1 = /* #__PURE__ */ Object.assign({\\"./node_modules/framework/pages/hello.page.js\\": () => import(\\"./node_modules/framework/pages/hello.page.js\\")});
|
||||
export const cleverCwd2 = /* #__PURE__ */ Object.assign({\\"./modules/a.ts\\": () => import(\\"./modules/a.ts\\"),\\"./modules/b.ts\\": () => import(\\"./modules/b.ts\\"),\\"../fixture-b/a.ts\\": () => import(\\"../fixture-b/a.ts\\"),\\"../fixture-b/b.ts\\": () => import(\\"../fixture-b/b.ts\\")});
|
||||
"
|
||||
`;
|
||||
|
||||
exports[`fixture > virtual modules 1`] = `
|
||||
"Object.assign({\\"/modules/a.ts\\": () => import(\\"/modules/a.ts\\"),\\"/modules/b.ts\\": () => import(\\"/modules/b.ts\\"),\\"/modules/index.ts\\": () => import(\\"/modules/index.ts\\")})
|
||||
Object.assign({\\"/../fixture-b/a.ts\\": () => import(\\"/../fixture-b/a.ts\\"),\\"/../fixture-b/b.ts\\": () => import(\\"/../fixture-b/b.ts\\"),\\"/../fixture-b/index.ts\\": () => import(\\"/../fixture-b/index.ts\\")})"
|
||||
"/* #__PURE__ */ Object.assign({\\"/modules/a.ts\\": () => import(\\"/modules/a.ts\\"),\\"/modules/b.ts\\": () => import(\\"/modules/b.ts\\"),\\"/modules/index.ts\\": () => import(\\"/modules/index.ts\\")})
|
||||
/* #__PURE__ */ Object.assign({\\"/../fixture-b/a.ts\\": () => import(\\"/../fixture-b/a.ts\\"),\\"/../fixture-b/b.ts\\": () => import(\\"/../fixture-b/b.ts\\"),\\"/../fixture-b/index.ts\\": () => import(\\"/../fixture-b/index.ts\\")})"
|
||||
`;
|
||||
|
||||
@ -438,7 +438,9 @@ export async function transformGlobImport(
|
||||
|
||||
files.forEach((i) => matchedFiles.add(i))
|
||||
|
||||
const replacement = `Object.assign({${objectProps.join(',')}})`
|
||||
const replacement = `/* #__PURE__ */ Object.assign({${objectProps.join(
|
||||
','
|
||||
)}})`
|
||||
s.overwrite(start, end, replacement)
|
||||
|
||||
return staticImports
|
||||
|
||||
@ -1,4 +1,13 @@
|
||||
import { addFile, editFile, isBuild, page, removeFile, withRetry } from '~utils'
|
||||
import {
|
||||
addFile,
|
||||
editFile,
|
||||
findAssetFile,
|
||||
getColor,
|
||||
isBuild,
|
||||
page,
|
||||
removeFile,
|
||||
withRetry
|
||||
} from '~utils'
|
||||
|
||||
const filteredResult = {
|
||||
'./alias.js': {
|
||||
@ -158,3 +167,16 @@ if (!isBuild) {
|
||||
})
|
||||
})
|
||||
}
|
||||
|
||||
test('tree-shake eager css', async () => {
|
||||
expect(await getColor('.tree-shake-eager-css')).toBe('orange')
|
||||
expect(await getColor('.no-tree-shake-eager-css')).toBe('orange')
|
||||
expect(await page.textContent('.no-tree-shake-eager-css-result')).toMatch(
|
||||
'.no-tree-shake-eager-css'
|
||||
)
|
||||
|
||||
if (isBuild) {
|
||||
const content = findAssetFile(/index\.\w+\.js/)
|
||||
expect(content).not.toMatch('.tree-shake-eager-css')
|
||||
}
|
||||
})
|
||||
|
||||
@ -13,6 +13,10 @@
|
||||
<pre class="relative-glob-raw"></pre>
|
||||
<h2>Side effect</h2>
|
||||
<pre class="side-effect-result"></pre>
|
||||
<h2>Tree shake Eager CSS</h2>
|
||||
<p class="tree-shake-eager-css">Should be orange</p>
|
||||
<p class="no-tree-shake-eager-css">Should be orange</p>
|
||||
<pre class="no-tree-shake-eager-css-result"></pre>
|
||||
|
||||
<script type="module" src="./dir/index.js"></script>
|
||||
<script type="module">
|
||||
@ -107,3 +111,10 @@
|
||||
const notInvocation = neverInvoke
|
||||
import.meta.glob('/side-effect/**', { eager: true })
|
||||
</script>
|
||||
|
||||
<script type="module">
|
||||
import.meta.glob('/tree-shake.css', { eager: true })
|
||||
const results = import.meta.glob('/no-tree-shake.css', { eager: true })
|
||||
document.querySelector('.no-tree-shake-eager-css-result').textContent =
|
||||
results['/no-tree-shake.css'].default
|
||||
</script>
|
||||
|
||||
3
playground/glob-import/no-tree-shake.css
Normal file
3
playground/glob-import/no-tree-shake.css
Normal file
@ -0,0 +1,3 @@
|
||||
.no-tree-shake-eager-css {
|
||||
color: orange;
|
||||
}
|
||||
3
playground/glob-import/tree-shake.css
Normal file
3
playground/glob-import/tree-shake.css
Normal file
@ -0,0 +1,3 @@
|
||||
.tree-shake-eager-css {
|
||||
color: orange;
|
||||
}
|
||||
Loading…
Reference in New Issue
Block a user