Skip to content
New issue

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

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

Already on GitHub? Sign in to your account

fix(glob): wrap glob compile output in function invocation #3682

Merged
merged 3 commits into from May 10, 2022
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
4 changes: 4 additions & 0 deletions packages/playground/glob-import/side-effect/writetodom.js
@@ -0,0 +1,4 @@
/* global document */
document &&
(document.querySelector('.side-effect-result').textContent =
'Hello from side effect')
Expand Up @@ -10,67 +10,67 @@ 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 = {
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 = {
});
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 = {
});
export const ignore = Object.assign({
\\"./modules/a.ts\\": () => import(\\"./modules/a.ts\\"),
\\"./modules/b.ts\\": () => import(\\"./modules/b.ts\\")
};
export const namedEager = {
});
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 = {
});
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 = {
});
export const eagerAs = Object.assign({
\\"./modules/a.ts\\": __vite_glob_5_0,
\\"./modules/b.ts\\": __vite_glob_5_1
};
export const rawImportModule = {
});
export const rawImportModule = Object.assign({
\\"./modules/a.ts\\": () => import(\\"./modules/a.ts?raw\\"),
\\"./modules/b.ts\\": () => import(\\"./modules/b.ts?raw\\")
};
export const excludeSelf = {
});
export const excludeSelf = Object.assign({
\\"./sibling.ts\\": () => import(\\"./sibling.ts\\")
};
export const customQueryString = {
});
export const customQueryString = Object.assign({
\\"./sibling.ts\\": () => import(\\"./sibling.ts?custom\\")
};
export const customQueryObject = {
});
export const customQueryObject = Object.assign({
\\"./sibling.ts\\": () => import(\\"./sibling.ts?foo=bar&raw=true\\")
};
export const parent = {
});
export const parent = Object.assign({

};
export const rootMixedRelative = {
});
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\\"]),
\\"/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 = {
});
export const cleverCwd1 = Object.assign({
\\"./node_modules/framework/pages/hello.page.js\\": () => import(\\"./node_modules/framework/pages/hello.page.js\\")
};
export const cleverCwd2 = {
});
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\\")
};
});
"
`;

Expand All @@ -84,79 +84,79 @@ 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 = {
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 = {
});
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 = {
});
export const ignore = Object.assign({
\\"./modules/a.ts\\": () => import(\\"./modules/a.ts\\"),
\\"./modules/b.ts\\": () => import(\\"./modules/b.ts\\")
};
export const namedEager = {
});
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 = {
});
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 = {
});
export const eagerAs = Object.assign({
\\"./modules/a.ts\\": __vite_glob_5_0,
\\"./modules/b.ts\\": __vite_glob_5_1
};
export const rawImportModule = {
});
export const rawImportModule = Object.assign({
\\"./modules/a.ts\\": () => import(\\"./modules/a.ts?raw\\"),
\\"./modules/b.ts\\": () => import(\\"./modules/b.ts?raw\\")
};
export const excludeSelf = {
});
export const excludeSelf = Object.assign({
\\"./sibling.ts\\": () => import(\\"./sibling.ts\\")
};
export const customQueryString = {
});
export const customQueryString = Object.assign({
\\"./sibling.ts\\": () => import(\\"./sibling.ts?custom&lang.ts\\")
};
export const customQueryObject = {
});
export const customQueryObject = Object.assign({
\\"./sibling.ts\\": () => import(\\"./sibling.ts?foo=bar&raw=true&lang.ts\\")
};
export const parent = {
});
export const parent = Object.assign({

};
export const rootMixedRelative = {
});
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\\"]),
\\"/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 = {
});
export const cleverCwd1 = Object.assign({
\\"./node_modules/framework/pages/hello.page.js\\": () => import(\\"./node_modules/framework/pages/hello.page.js\\")
};
export const cleverCwd2 = {
});
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\\")
};
});
"
`;

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\\")
}"
})"
`;
2 changes: 1 addition & 1 deletion packages/vite/src/node/plugins/importMetaGlob.ts
Expand Up @@ -398,7 +398,7 @@ export async function transformGlobImport(

files.forEach((i) => matchedFiles.add(i))

const replacement = `{\n${objectProps.join(',\n')}\n}`
const replacement = `Object.assign({\n${objectProps.join(',\n')}\n})`
s.overwrite(start, end, replacement)

return staticImports
Expand Down
27 changes: 20 additions & 7 deletions playground/glob-import/__tests__/glob-import.spec.ts
Expand Up @@ -31,6 +31,12 @@ const json = isBuild
msg: 'baz'
}

const globWithAlias = {
'/dir/alias.js': {
default: 'hi'
}
}

const allResult = {
// JSON file should be properly transformed
'/dir/alias.js': {
Expand All @@ -40,14 +46,15 @@ const allResult = {
'/dir/foo.js': {
msg: 'foo'
},
'/dir/index.js': {
globWithAlias: {
'/dir/alias.js': {
default: 'hi'
'/dir/index.js': isBuild
? {
modules: filteredResult,
globWithAlias
}
},
modules: filteredResult
},
: {
globWithAlias,
modules: filteredResult
},
'/dir/nested/bar.js': {
modules: {
'../baz.json': json
Expand Down Expand Up @@ -93,6 +100,12 @@ test('import relative glob raw', async () => {
)
})

test('unassigned import processes', async () => {
expect(await page.textContent('.side-effect-result')).toBe(
'Hello from side effect'
)
})

if (!isBuild) {
test('hmr for adding/removing files', async () => {
addFile('dir/a.js', '')
Expand Down
9 changes: 9 additions & 0 deletions playground/glob-import/index.html
Expand Up @@ -2,6 +2,7 @@
<pre class="result-node_modules"></pre>
<pre class="globraw"></pre>
<pre class="relative-glob-raw"></pre>
<pre class="side-effect-result"></pre>

<script type="module" src="./dir/index.js"></script>
<script type="module">
Expand Down Expand Up @@ -70,3 +71,11 @@
2
)
</script>

<script type="module">
const neverInvoke = () =>
(document.querySelector('.side-effect-result').textContent =
"Syntax generated from 'import.meta.glob' must do ASI.")
const notInvocation = neverInvoke
import.meta.glob('/side-effect/**', { eager: true })
</script>
4 changes: 4 additions & 0 deletions playground/glob-import/side-effect/writedom.js
@@ -0,0 +1,4 @@
/* global document */
document &&
(document.querySelector('.side-effect-result').textContent =
'Hello from side effect')