Skip to content
Open
Show file tree
Hide file tree
Changes from all commits
Commits
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
14 changes: 14 additions & 0 deletions docs/guide/features.md
Original file line number Diff line number Diff line change
Expand Up @@ -625,6 +625,20 @@ Only the globs that are relative paths are interpreted as relative to the resolv

All the resulting module keys are modified to be relative to the base if provided.

#### Case Sensitive Matching

By default, glob pattern matching is case-sensitive. You can use the `caseSensitiveMatch` option to change this behavior:

```ts twoslash
import 'vite/client'
// ---cut---
const modules = import.meta.glob('./dir/module*.js', {
caseSensitiveMatch: false,
})
```

With `caseSensitiveMatch: false`, the glob will match files regardless of case (e.g., `Module.js`, `module.js`, `MODULE.js` will all be matched by `module*.js`).

### Glob Import Caveats

Note that:
Expand Down
2 changes: 2 additions & 0 deletions packages/vite/src/node/plugins/importMetaGlob.ts
Original file line number Diff line number Diff line change
Expand Up @@ -134,6 +134,7 @@ const knownOptions = {
exhaustive: ['boolean'],
query: ['object', 'string'],
base: ['string'],
caseSensitiveMatch: ['boolean'],
}

const forceDefaultAs = ['raw', 'url']
Expand Down Expand Up @@ -454,6 +455,7 @@ export async function transformGlobImport(
cwd,
dot: !!options.exhaustive,
expandDirectories: false,
caseSensitiveMatch: options.caseSensitiveMatch ?? true,
ignore: options.exhaustive ? [] : ['**/node_modules/**'],
})
)
Expand Down
4 changes: 4 additions & 0 deletions packages/vite/types/importGlob.d.ts
Original file line number Diff line number Diff line change
Expand Up @@ -32,6 +32,10 @@ export interface ImportGlobOptions<
* Base path to resolve relative paths.
*/
base?: string
/**
* Whether the glob pattern matching should be case-sensitive. Defaults to `true`.
*/
caseSensitiveMatch?: boolean
}

export type GeneralImportGlobOptions = ImportGlobOptions<boolean, string>
Expand Down
19 changes: 19 additions & 0 deletions playground/glob-import/__tests__/glob-import.spec.ts
Original file line number Diff line number Diff line change
Expand Up @@ -311,3 +311,22 @@ test('import.meta.glob and dynamic import vars transformations should be visible
JSON.stringify({ globTransformed: true, dynamicImportTransformed: true }),
)
})

test('caseSensitiveMatch option', async () => {
await expect
.poll(async () =>
JSON.parse(await page.textContent('.case-sensitive-true')),
)
.toStrictEqual(['./case-sensitive-dir/data-test.js'])

if (process.env._VITE_TEST_JS_PLUGIN) {
await expect
.poll(async () =>
JSON.parse(await page.textContent('.case-sensitive-false')),
)
.toStrictEqual([
'./case-sensitive-dir/DATA-other.js',
'./case-sensitive-dir/data-test.js',
])
}
})
1 change: 1 addition & 0 deletions playground/glob-import/case-sensitive-dir/DATA-other.js
Original file line number Diff line number Diff line change
@@ -0,0 +1 @@
export default 'DATA-OTHER'
1 change: 1 addition & 0 deletions playground/glob-import/case-sensitive-dir/data-test.js
Original file line number Diff line number Diff line change
@@ -0,0 +1 @@
export default 'data-test'
35 changes: 35 additions & 0 deletions playground/glob-import/index.html
Original file line number Diff line number Diff line change
Expand Up @@ -214,3 +214,38 @@ <h2>Transform visibility</h2>
document.querySelector('.transform-visibility').textContent =
JSON.stringify(result)
</script>

<h2>Case Sensitive Match (default: true)</h2>
<pre class="case-sensitive-true"></pre>

<h2>Case Sensitive Match (false)</h2>
<pre class="case-sensitive-false"></pre>

<script type="module">
const caseSensitiveModules = import.meta.glob(
'./case-sensitive-dir/data-*.js',
{
eager: true,
import: 'default',
},
)
document.querySelector('.case-sensitive-true').textContent = JSON.stringify(
Object.keys(caseSensitiveModules).sort(),
null,
2,
)

const caseInsensitiveModules = import.meta.glob(
'./case-sensitive-dir/data-*.js',
{
eager: true,
import: 'default',
caseSensitiveMatch: false,
},
)
document.querySelector('.case-sensitive-false').textContent = JSON.stringify(
Object.keys(caseInsensitiveModules).sort(),
null,
2,
)
</script>