|
1 | 1 | # css-typed
|
2 |
| -Basic TypeScript declaration generator for CSS files |
| 2 | + |
| 3 | +Basic TypeScript declaration generator for CSS files. |
| 4 | + |
| 5 | +## Motivation |
| 6 | + |
| 7 | +[typescript-plugin-css-modules] provides a great IDE experience, but cannot |
| 8 | +perform build-failing type-checking. Furthermore, the traditional TypeScript |
| 9 | +ambient module definition fails the `noUncheckedIndexedAccess` strict check and |
| 10 | +causes issues with typed ESLint rules. |
| 11 | + |
| 12 | +```ts |
| 13 | +// This does not provide strict typing |
| 14 | +declare module "*.module.css" { |
| 15 | + const classes: { [key: string]: string }; |
| 16 | + export default classes; // It also uses default export 😿 |
| 17 | +} |
| 18 | +``` |
| 19 | + |
| 20 | +[typed-css-modules] and [typed-scss-modules] exist, but the former does not have |
| 21 | +recent activity and the latter focuses on SCSS (and my current (2023) interests |
| 22 | +involve modern CSS only). Both depend on [css-modules-loader-core], which |
| 23 | +appears [abandoned][174]. |
| 24 | + |
| 25 | +Therefore, I wrote my own (very basic) implementation. |
| 26 | + |
| 27 | +<!-- prettier-ignore-start --> |
| 28 | +[typescript-plugin-css-modules]: https://www.npmjs.com/package/typescript-plugin-css-modules |
| 29 | +[typed-css-modules]: https://www.npmjs.com/package/typed-css-modules |
| 30 | +[typed-scss-modules]: https://www.npmjs.com/package/typed-scss-modules |
| 31 | +[css-modules-loader-core]: https://www.npmjs.com/package/css-modules-loader-core |
| 32 | +[174]: https://github.com/css-modules/css-modules-loader-core/issues/174 |
| 33 | +<!-- prettier-ignore-end --> |
0 commit comments