open-index/open-npm huggingface dataset:
npm package: @superkoders/eslint-typescript-config
Description: SUPERKODERS eslint Typescript configuration
Author: Petr Grochal
Latest version: 0.2.6

# @superkoders/eslint-config

## Instalation
In case you have a Typescript project, use this package instead of `@superkoders/eslint-config`. This package is extending it with some rules for Typescript.

### 1. Install the package
```bash
npm i -D @superkoders/eslint-typescript-config
```

### 2. Add .eslintrc.js
This tells linter where to locate our rules. You can also override the rules here, if you have some exception on a given project.
```js
module.exports = {
	'extends': ['@superkoders/eslint-typescript-config']
};
```

### 3. Add `.eslintignore`
Package.json and package-lock.json is generated automatically. It might be problematic to enforce styling on this one. Use your own config, which might contain things like those:
```yaml
# Of particular note is that like .gitignore files, all paths used as patterns for both .eslintignore and --ignore-pattern must use forward slashes as their path separators.
# /node_modules/* and /bower_components/* in the project root are ignored by default
web/**/*
src/js/static/**/*
```

### 4. Add Prettier
Prettier comes with some opinions by default, which can conflict with other linters' settings. This will make sure they're in sync. Docs on how to [download and setup SK Prettier config](https://www.npmjs.com/package/@superkoders/prettier-config).

### 5. Add lint script to the package.json
And adjust the paths to your project needs.
```json
{
	"scripts": {
		"lint:js": "eslint .; exit 0",
		"lint:js:fix": "eslint . --fix",
	},
}
```

### 6. Optional: Install git hooks utility
If you want to prevent commiting bad code, you can let it check before commiting. If not right, it will notify the developer. When the code is correct, it will get a green light to the repo.
```bash
npm i -D husky lint-staged
```

### 7. Set up the pre-commit hook
Add to the package.json
```json
"husky": {
	"hooks": {
		"pre-commit": "lint-staged"
	}
},
"lint-staged": {
	"*.js": [
		"eslint"
	]
},
```
Running `npm run lint-js` will check the code and output list of errors and warnings to the console.
Running `npm run lint-js:fix` will check and fix the code. This is omst useful when introducing linter to existing codebase.

### 8. Optional: Live error/warning highlightning with editor extension
Download an extension, which will highlight problematic code and give you options how to fix it or which will auto format it as you save.
<a href="https://marketplace.visualstudio.com/items?itemName=esbenp.prettier-vscode" target="_blank" rel="noreferrer noopener">Prettier do VS Code</a>
<a href="https://marketplace.visualstudio.com/items?itemName=dbaeumer.vscode-eslint" target="_blank" rel="noreferrer noopener">ESLint do VS Code</a>

### 9. Update VS Code settings for autoformatting
Ideally, save those settings in `.vscode/settings.json` so it lives with the project, if it isn't there already.
```json
"editor.formatOnSave": true,
"editor.codeActionsOnSave": {
	"source.fixAll.eslint": true,
},
"prettier.requireConfig": true, // Only format configured projects
```
npm package: @superkoders/prettier-config
Description: SUPERKODERS prettier configuration
Author: jena.hajek
Latest version: 0.2.6

# @superkoders/prettier-config

SK shareable prettier config, which is prepared for use with [our eslint configuration](https://www.npmjs.com/package/@superkoders/eslint-config)

## Instalation

### 1. Install the package
```bash
npm i -D @superkoders/prettier-config
```

### 2. Add .prettierrc.js
This tells prettier where to locate our rules. You can also override the rules here, if you have some exception on a given project.
```js
module.exports = {
	...require('@superkoders/prettier-config'),
};
```

If you need to make special overrides for given project, you can do so like this:
```js
module.exports = {
	...require('@superkoders/prettier-config'),
	useTabs: true // you can add overrides like so
};
```

### 3. Add .prettierignore
Specify paths and files you don't want to autoformat. Be sure to ignore minified 3rd party files. Good starting point might be this:
```yaml
*.md
*.mdown
*.mdx
package.json
package-lock.json
web/*
src/js/static/*
**/node_modules/**/*
```

### 4. Add .gitattributes file
Make sure, that line endings will be same accross platforms / OS. This line will make the magic:
```yaml
* text eol=lf
```


### 5. Optional: Live error/warning highlightning with editor extension
Download an extension, which will highlight problematic code and give you options how to fix it or which will auto format it as you save.
<a href="https://marketplace.visualstudio.com/items?itemName=esbenp.prettier-vscode" target="_blank" rel="noreferrer noopener">Prettier do VS Code</a>


### 6. Update VS Code settings for autoformatting
Ideally, save those settings in `.vscode/settings.json` so it lives with the project, if it isn't there already.
```json
"editor.formatOnSave": true,
"prettier.requireConfig": true, // Only format configured projects
```
npm package: @superkoders/sk-tools
Description: toolkit of helper functions
Latest version: 1.8.3

# SUPERKODERS Tools

Toolkit of helper functions

### Usage
```
import {addClass} from '@superkoders/sk-tools/src/className'
```

Tools which you can import separately. If your build process can tree shaking you get the smallest file.
Documentation will be created. For now read from code
[https://bitbucket.org/superkoders/sk-tools/src/master/src/](https://bitbucket.org/superkoders/sk-tools/src/master/src/)
npm package: @superkoders/styled-jsx-plugin-sass
Description: Plugin to add Sass support to styled-jsx
Author: Marton Lederer
Latest version: 2.0.3

# styled-jsx-plugin-sass-2

Use [Sass](http://sass-lang.com/) with [styled-jsx](https://github.com/vercel/styled-jsx) 💥

This is a fixed/updated version of [styled-jsx-plugin-sass](https://github.com/giuseppeg/styled-jsx-plugin-sass) by [@giuseppeg](https://github.com/giuseppeg), made because that package seems to be unmaintained.

This SUPERKODERS version is forked from [commit 1223475](https://github.com/martonlederer/styled-jsx-plugin-sass-2/commit/1223475558e24cd38ad3da71b146bfb6259038ff).

## What's the difference?

This plugin works with [indented sass](#indented-syntax) and [dart sass](#dart-sass) too, neither of those were possible with the old package. It also includes code from pull requests that weren't merged in the original repo.

Credits to [@giuseppeg](https://github.com/giuseppeg), [@xhuz](https://github.com/xhuz) and [@jamestalmage](https://github.com/jamestalmage).

## Usage

Install the package and the `node-sass` (or [dart-sass](#dart-sass)) version you need (it is a peer dependency).

```sh
npm install --save-dev node-sass @styled-jsx/plugin-sass
```

with yarn

```sh
yarn add -D node-sass @styled-jsx/plugin-sass
```

Next, add `@styled-jsx/plugin-sass` to the `styled-jsx`'s `plugins` in your babel configuration (e.g. `.babelrc`):

```json
{
  "presets": [
    [
      "next/babel",
      {
        "styled-jsx": {
          "plugins": ["@styled-jsx/plugin-sass"]
        }
      }
    ]
  ]
}
```

## Node-sass options

Node-sass can be configured using `sassOptions`. This is useful for setting options such as `includePaths` or `precision`.

```json
{
  "presets": [
    [
      "next/babel",
      {
        "styled-jsx": {
          "plugins": [
            ["@styled-jsx/plugin-sass", {
                "sassOptions": {
                  "includePaths": ["./styles"],
                  "precision": 2
                }
              }
            ]
          ]
        }
      }
    ]
  ]
}
```

### Indented syntax

To use indented sytax, you will need to update your `sassOptions` inside your babel configuration file.

```json
{
  "presets": [
    [
      "next/babel",
      {
        "styled-jsx": {
          "plugins": [["@styled-jsx/plugin-sass", { "sassOptions": { "indentedSyntax": true } }]]
        }
      }
    ]
  ]
}
```

### Dart sass

If you want to use Dart sass instead of `node-sass`, your install command should look like this:

```sh
npm install --save-dev sass @styled-jsx/plugin-sass
```

with yarn

```sh
yarn add -D sass @styled-jsx/plugin-sass
```

#### Notes

`@styled-jsx/plugin-sass` uses `styled-jsx`'s plugin system which is supported from version 2.

Read more on their repository for further info.

## License

MIT