Skip to content
New issue

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

Sign up for GitHub

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

Already on GitHub? Sign in to your account

Jump to bottom

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

Merged
merged 3 commits into from
May 10, 2022
Merged

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

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
939b680
fix: Wrap glob output in function invocation
Jun 5, 2021
9b88a7c
chore: merge main
patak-dev May 10, 2022
c19b3ad
test: update snapshots
patak-dev May 10, 2022
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 4 additions & 0 deletions packages/playground/glob-import/side-effect/writetodom.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,4 @@
/* global document */
document &&
(document.querySelector('.side-effect-result').textContent =
'Hello from side effect')
120 changes: 60 additions & 60 deletions packages/vite/src/node/__tests__/plugins/importGlob/__snapshots__/fixture.test.ts.snap
View file
Open in desktop
Original file line number Diff line number Diff line change
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
View file
Open in desktop
Original file line number Diff line number Diff line change
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
View file
Open in desktop
Original file line number Diff line number Diff line change
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
View file
Open in desktop
Original file line number Diff line number Diff line change
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
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,4 @@
/* global document */
document &&
(document.querySelector('.side-effect-result').textContent =
'Hello from side effect')