https://github.com/rfgamaral/parcel-plugin-typings-for-css-modules
📦 A plugin for the Parcel bundler to generate .d.ts files for your CSS Modules.
https://github.com/rfgamaral/parcel-plugin-typings-for-css-modules
css css-modules module parcel parcel-bundler type-definitions typed-css-modules types typescript
Last synced: 23 days ago
JSON representation
📦 A plugin for the Parcel bundler to generate .d.ts files for your CSS Modules.
- Host: GitHub
- URL: https://github.com/rfgamaral/parcel-plugin-typings-for-css-modules
- Owner: rfgamaral
- License: mit
- Created: 2019-07-03T15:17:12.000Z (almost 6 years ago)
- Default Branch: master
- Last Pushed: 2025-03-12T18:31:23.000Z (about 1 month ago)
- Last Synced: 2025-03-21T01:34:05.425Z (28 days ago)
- Topics: css, css-modules, module, parcel, parcel-bundler, type-definitions, typed-css-modules, types, typescript
- Language: JavaScript
- Homepage:
- Size: 486 KB
- Stars: 7
- Watchers: 1
- Forks: 0
- Open Issues: 28
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- License: LICENSE
Awesome Lists containing this project
- awesome-parcel - CSS Modules - css-modules](https://github.com/Quramy/typed-css-modules). (Plugins / Other)
README
# @rfgamaral/parcel-plugin-typings-for-css-modules
[](https://www.npmjs.com/package/@rfgamaral/parcel-plugin-typings-for-css-modules)
[](https://bundlephobia.com/result?p=@rfgamaral/parcel-plugin-typings-for-css-modules)
[](https://www.npmtrends.com/@rfgamaral/parcel-plugin-typings-for-css-modules)
[](http://commitizen.github.io/cz-cli/)
[](https://github.com/semantic-release/semantic-release)
[](LICENSE)
A plugin for the [Parcel](https://parceljs.org/) bundler to generate `.d.ts` (TypeScript type definitions) files for your [CSS Modules](https://github.com/css-modules/css-modules), powered by [`typed-css-modules`](https://github.com/Quramy/typed-css-modules).
## Installation
Just use your favorite 📦 package manager to install the plugin in your project's `devDependencies`:
**npm:**
```sh
npm install --save-dev @rfgamaral/parcel-plugin-typings-for-css-modules
```
**Yarn:**
```sh
yarn add --dev @rfgamaral/parcel-plugin-typings-for-css-modules
```
## Usage
Parcel will handle everything for you automagically, just make sure it's [configured to use PostCSS with CSS Modules](https://en.parceljs.org/css.html#postcss) by adding a `.postcssrc` file to your project root with:
```json
{
"modules": true
}
```
This plugin also includes support for [naming local class names in camelCase](https://github.com/css-modules/postcss-modules#camel-cased-classes), just pass the `{ camelCase: true }` option to the `.postcssrc` file, like so:
```json
{
"modules": true,
"plugins": {
"postcss-modules": {
"camelCase": true
}
}
}
```
**Note:** With `camelCase` option set to `true`, only kebab-case class names will be converted to camelCase, PascalCase class names will remain as is.
## Credits
This plugin borrows heavily from the follwing similar Parcel plugins:
- [`parcel-plugin-css-modules-type-generator`](https://github.com/garthenweb/parcel-plugin-css-modules-type-generator)
- [`parcel-plugin-typed-css-modules`](https://github.com/Place1/parcel-plugin-typed-css-modules)
Thank you [@garthenweb](https://github.com/garthenweb) and [@Place1](https://github.com/Place1) 🙏
## License
The use of this source code is governed by an MIT-style license that can be found in the [LICENSE](LICENSE) file.