mizdra / mizdra/css-modules-kit
Updating import statements fails if `declare module '*.module.css' {...}` exists
Nobody has claimed this yet.
- Dominant language
- TypeScript
- Stars
- 197
- Forks
- 15
- Avg merge
- 1h 33m
- Merged PRs (30d)
- 9
Description
If any of the following file exist in the project, update of the import statement will fail.
// src/global.d.ts
declare module '*.module.css' {
const classes: { [className: string]: string };
export default classes;
}
How to reproduce
https://github.com/mizdra/css-modules-kit-example/tree/a44af6d329f2f86c4cd5a885382a2d38bed3a567
First, do the following:
git clone git@github.com:mizdra/css-modules-kit-example.git
git checkout a44af6d329f2f86c4cd5a885382a2d38bed3a567
npm i
code --profile-temp .
Next, install mizdra.css-modules-kit-vscode in VS Code. Then, rename src/a.module.css to src/aa.module.css from VS Code's Explorer panel.
https://github.com/user-attachments/assets/7cd396ae-491f-41cc-b207-9dc786e2c6e8
Workaround
Removing or commenting out the ambient module declaration in *.module.css will avoid the problem.
// src/global.d.ts
// declare module '*.module.css' {
// const classes: { [className: string]: string };
// export default classes;
// }
https://github.com/user-attachments/assets/244c72ad-780a-4daf-8f69-41bc8a388879
Contributor guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Research direction
Clone the linked css-modules-kit-example repository at commit a44af6d, install dependencies, and inspect src/global.d.ts alongside src/a.module.css. Reproduce the failure by renaming src/a.module.css to src/aa.module.css in VS Code, comparing behavior with and without the ambient module declaration; done means the import statement updates successfully while the declaration remains present.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- css, typescript, vscode
- Domain
- devtools, tooling
- Issue type
- Bug
- Difficulty
- 4/5
- Estimated time
- 3-5 days
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 45/100