https://github.com/kristerkari/stylelint-config-react-native-css-modules

Shareable stylelint config for React Native CSS modules
https://github.com/kristerkari/stylelint-config-react-native-css-modules

css-modules linter-config react-native stylelint

Last synced: 10 months ago
JSON representation

Shareable stylelint config for React Native CSS modules

• Host: GitHub
• URL: https://github.com/kristerkari/stylelint-config-react-native-css-modules
• Owner: kristerkari
• License: mit
• Created: 2018-02-11T11:03:36.000Z (almost 8 years ago)
• Default Branch: master
• Last Pushed: 2024-12-16T12:21:55.000Z (about 1 year ago)
• Last Synced: 2025-03-13T06:34:01.668Z (10 months ago)
• Topics: css-modules, linter-config, react-native, stylelint
• Language: JavaScript
• Homepage:
• Size: 3.56 MB
• Stars: 7
• Watchers: 2
• Forks: 1
• Open Issues: 4
• Metadata Files:
  • Readme: README.md
  • Changelog: CHANGELOG.md
  • License: LICENSE

Awesome Lists containing this project

README

          
# stylelint-config-react-native-css-modules

[![NPM version](http://img.shields.io/npm/v/stylelint-config-react-native-css-modules.svg)](https://www.npmjs.org/package/stylelint-config-react-native-css-modules)

[![Build Status](https://github.com/kristerkari/stylelint-config-react-native-css-modules/workflows/Tests/badge.svg)](https://github.com/kristerkari/stylelint-config-react-native-css-modules/actions?workflow=Tests)

[![Downloads per month](https://img.shields.io/npm/dm/stylelint-config-react-native-css-modules.svg)](http://npmcharts.com/compare/stylelint-config-react-native-css-modules?periodLength=30)

[![contributions welcome](https://img.shields.io/badge/contributions-welcome-brightgreen.svg?style=flat)](https://egghead.io/courses/how-to-contribute-to-an-open-source-project-on-github)

Shareable stylelint config for [React Native CSS modules](https://github.com/kristerkari/react-native-css-modules)



## Installation and usage

Install `stylelint-config-react-native-css-modules` (and `stylelint` + `stylelint-react-native`, if you haven't done so yet):

```

yarn add stylelint stylelint-react-native stylelint-config-react-native-css-modules --dev

```

or

```

npm install stylelint stylelint-react-native stylelint-config-react-native-css-modules --save-dev

```

Create the `.stylelintrc` config file (or open the existing one) and extend `stylelint-config-react-native-css-modules` config.

```json

{

  "extends": "stylelint-config-react-native-css-modules",

  "rules": {

    "selector-class-pattern": "^[a-z][a-zA-Z0-9]*$"

  }

}

```

## Config for React Native + Web

By default the config is for React Native only, but if you want to share the styles between React Native and Web, extend the `stylelint-config-react-native-css-modules/web` config instead. This turns some of the errors to warnings to ensure compatibility with Web.

```json

{

  "extends": "stylelint-config-react-native-css-modules/web",

  "rules": {

    "selector-class-pattern": "^[a-z][a-zA-Z0-9]*$"

  }

}

```

If you want to turn off any of the included errors or warnings, set the rule's value to `null`:

```json

{

  "extends": "stylelint-config-react-native-css-modules/web",

  "rules": {

    "react-native/font-weight-no-ignored-values": null

  }

}

```