StyleCI

The StyleCI Docs

Welcome to the StyleCI docs. You'll find comprehensive guides and documentation to help you start working with StyleCI as quickly as possible, as well as support if you get stuck. Let's jump right in!

Get Started    Guides

Multiple Languages

We now support JavaScript, JSX, Typescript, CSS, SCSS, Less, Vue.js, and Python!

Fixing Strategyies

Our PHP fixing works by applying fixers to files that fix specific things. By comparison, our new language support works differently by reprinting the entire file. It may seem like there's less being fixed because they are fewer options, but in fact, this is not the case. Everything is being standardized, and the configuration allows you to choose how you want things to look.

BC Notice

We have retained the default of only fixing PHP by default for backwards compatibility reasons. You may need to disable PHP and enable the language(s) you want.

New Config Structure

Support for multiple languages is available on the current Solo, Startup, and Premium plans. In order to accommodate multiple languages, we are adding top-level config to configure each language. Our default configuration file now resolves to:

php: true
js: false
ts: false
css: false
vue: false
py: false

You can enable the languages you want by either setting the value for each to true, to a configuration map.

Default Merging

By "default config", we mean what happens both when you don't specify a config file, and what config will be merged with any that you provide.

Finder Config

Please make sure you make the finder config mutually exclusive with respect to the files that it will match. We currently do not enforce this, but are likely to in the future.

PHP Config

Setting php: true, this means the following:

php:
  preset: recommended
  risky: true
  finder:
    exclude:
      - modules
      - node_modules
      - storage
      - vendor
    name: "*.php"
    not-name: "*.blade.php"

Instead of writing php: true, you may write exactly what is above, indeed, you could exclude keys, since we are merging the config you provide, so, you could write the following:

php:
  preset: laravel

... and this would simply resolve in full to:

php:
  preset: laravel
  risky: true
  finder:
    exclude:
      - modules
      - node_modules
      - storage
      - vendor
    name: "*.php"
    not-name: "*.blade.php"
js: false
ts: false
css: false
py: false
  • Valid values for preset are none, psr1, psr2, symfony, laravel, recommended.
  • Valid values for risky are false and true.

You can also provide a flat array of fixers to enable or disable, under enabled and disabled.

JavaScript Config

Setting js: true, this means the following:

js:
  tab-width: 4
  use-tabs: false
  print-width: 120
  double-quotes: false
  trailing-commas: es5
  semicolons: true
  arrow-parens: avoid
  bracket-spacing: true
  finder:
    exclude:
      - modules
      - node_modules
      - storage
      - vendor
    name:
      - "*.js"
      - "*.jsx"
    not-name:
      - "*.min.js"
  • Valid values for tab-width are integers between 2 and 8. We'd recommend either 2 or 4.
  • Valid values for use-tabs are false and true.
  • Valid values for print-width are integers between 20 and 200. We'd recommend 80, 100, or 120.
  • Valid values for double-quotes are false and true.
  • Valid values for trailing-commas are none, es5, or all.
  • Valid values for semicolons are false and true.
  • Valid values for arrow-parens are avoid and always.
  • Valid values for bracket-spacing are false and true.

TypeScript Config

Setting ts: true, this means the following:

ts:
  tab-width: 4
  use-tabs: false
  print-width: 120
  double-quotes: false
  trailing-commas: es5
  semicolons: true
  arrow-parens: avoid
  bracket-spacing: true
  finder:
    exclude:
      - modules
      - node_modules
      - storage
      - vendor
    name: "*.ts"
  • Valid values for tab-width are integers between 2 and 8. We'd recommend either 2 or 4.
  • Valid values for use-tabs are false and true.
  • Valid values for print-width are integers between 20 and 200. We'd recommend 80, 100, or 120.
  • Valid values for double-quotes are false and true.
  • Valid values for trailing-commas are none, es5, or all.
  • Valid values for semicolons are false and true.
  • Valid values for arrow-parens are avoid and always.
  • Valid values for bracket-spacing are false and true.

CSS Config

Setting css: true, this means the following:

css:
  tab-width: 4
  use-tabs: false
  print-width: 120
  double-quotes: false
  finder:
    exclude:
      - modules
      - node_modules
      - storage
      - vendor
    name:
      - "*.css"
      - "*.scss"
      - "*.less"
  • Valid values for tab-width are integers between 2 and 8. We'd recommend either 2 or 4.
  • Valid values for use-tabs are false and true.
  • Valid values for print-width are integers between 20 and 200. We'd recommend 80, 100, or 120.
  • Valid values for double-quotes are false and true.

Vue Config

Setting vue: true, this means the following:

vue:
  tab-width: 4
  use-tabs: false
  print-width: 120
  double-quotes: false
  trailing-commas: es5
  semicolons: true
  arrow-parens: avoid
  bracket-spacing: true
  finder:
    exclude:
      - modules
      - node_modules
      - storage
      - vendor
    name: "*.vue"
  • Valid values for tab-width are integers between 2 and 8. We'd recommend either 2 or 4.
  • Valid values for use-tabs are false and true.
  • Valid values for print-width are integers between 20 and 200. We'd recommend 80, 100, or 120.
  • Valid values for double-quotes are false and true.
  • Valid values for trailing-commas are none, es5, or all.
  • Valid values for semicolons are false and true.
  • Valid values for arrow-parens are avoid and always.
  • Valid values for bracket-spacing are false and true.

Python Config

PYTHON PUBLIC BETA

Support for Python is currently in beta. We'd especially like your feedback on this. Support for configuration indentation is missing, and will be coming soon. This will be coming soon, as the beta progresses.

Setting py: true, this means the following:

py:
  version: 3
  finder:
    exclude:
      - modules
      - node_modules
      - storage
      - vendor
    name: "*.py"

The version config specifies the python grammar version to use. We default to Python 3, however, you can change this to 2 if you need to target Python 2's grammar.

More Config?

We're looking for feedback as to what else you'd like to configure. Let us know, and we'll do our best to make it happen!