typed-css-modules

typed-css-modules

Creates TypeScript definition files from CSS Modules .css files.

If you have the following css,

/* styles.css */
.myClass {
  color: red;
}

this creates the following .d.ts files from the above css:

/* styles.css.d.ts */
export const myClass: string;

So, you can import CSS modules in your .ts sources:

import * as styles from './styles.css';
console.log(`<div class="${styles.myClass}"></div>`);

usage

CLI

npm install -g typed-css-modules

tcm <input directory>

Then, this creates *.css.d.ts file under the directory which has original .css file.

(your project root)
- src/
    | myStyle.css
    | myStyle.css.d.ts [created]

output directory

Use -o or --outDir option.

For example:

tcm src -o dist src

(your project root)
- src/
    | myStyle.css
- dist/
    | myStyle.css.d.ts [created]

file name pattern

By the default, this tool searches **/*.css files under <input directory>. If you can customize glob pattern, you can use --pattern or -p option.

tcm -p src/**/*.icss

watch

With -w or --watch, this CLI watches files in the input directory.

API

T.B.D.

License

This software is released under the MIT License, see LICENSE.txt.