# dia-scripts 🛠 📦

> CLI toolbox with common scripts for most sort of projects at
> [DIA][dia-website]

[![Commitizen friendly][commitizen-badge]][commitizen]
[![Conventional Commits][conventional-commits-badge]][conventional-commits]
[![Semantic Release][semantic-release-badge]][semantic-release]
[![Code of Conduct][coc-badge]][coc] [![MIT License][license-badge]][license]

[![npm latest version][latest-version-badge]][package]
[![npm next version][next-version-badge]][package]

<!-- [![All Contributors][contributors-badge]][contributors] -->

## The Problem

Every time we start a new project for Javascript, Lightning Web Components,
Salesforce, Web or Mobile, we find ourselves copying configuration files or [npm
run scripts][npm-run-scripts] or other tooling stuff from a previous project...
such an annoying task and prone to errors.

Also adding some new features for e.g. updating some babel configuration or
adding some [ESLint][] rules makes the update process on older projects a pain
and not really straight forward.

So we borrowed a nice solution from [Kent C. Dodds][kentcdodds] and his
[kcd-scripts][kcd-scripts]. Which originally was created as a
[PayPal][paypal-dev-twitter] internal project called `paypal-scripts`.

## This Solution

This is a CLI that abstracts away all configuration for linting, testing,
building, and more.

## Table of Contents

<!-- START doctoc generated TOC please keep comment here to allow auto update -->
<!-- DON'T EDIT THIS SECTION, INSTEAD RE-RUN doctoc TO UPDATE -->

- [Prerequisites](#markdown-header-prerequisites)
- [Installation](#markdown-header-installation)
- [Usage](#markdown-header-usage)
  - [Overriding Config](#markdown-header-overriding-config)
  - [Flow Support](#markdown-header-flow-support)
- [Other Solutions](#markdown-header-other-solutions)
- [Other Use Cases](#markdown-header-other-use-cases)
- [Acknowledgements](#markdown-header-acknowledgements)
- [License](#markdown-header-license)

<!-- END doctoc generated TOC please keep comment here to allow auto update -->

## Prerequisites

You need

- [Node.js 8+][node]
- [npm CLI 5+][npm-cli] - The [npm CLI][npm-cli] is shipped with and will be
  installed during the installation of [Node.js][node]. If the version is lower
  than needed - at least 5.x - you can update it via:

  ```bash
  npm install --global npm
  ```

## Installation

This module can be installed via [npm][npm-cli] which is bundled with
[Node.js][node] and should be installed as one of your project's
[devDependencies][]:

```bash
npm install --save-dev --save-exact @interaktiv/dia-scripts
```

## Usage

This is a CLI and exposes a bin called `dia-scripts`. For now the documentation
and testing was done very roughly. You'll find all available scripts in
[src/scripts](./src/scripts) if you miss something from the docs
([README.md](./README.md) 😅).

This project actually runs itself. If you look in the
[package.json](./package.json), you'll find scripts with
`node src {scriptName}`. This serves as an example of some of the things you can
do with `dia-scripts`.

### Overriding Config

`dia-scripts` allows you to specify your own configuration for things and have
that plug directly into the way things work. There are various ways that it
works, but basically if you want to have your own config for something, just add
the configuration and `dia-scripts` will use that instead of it's own internal
config.

📌 In addition, `dia-scripts` exposes its configuration so you can use it and
override only the parts of the config you need to.

This can be a very helpful way to make editor integration work for tools like
[ESLint][] which require project-based [ESLint][] configuration to be present to
work.

So, if we were to do this for [ESLint][], you could create an `.eslintrc.js`
with the contents of:

```javascript
{
  extends: ['./node_modules/@interaktiv/dia-scripts/eslint.js'],
}
```

Or, for `babel`, a `.babelrc.js` with:

```javascript
{
  presets: ['@interaktiv/dia-scripts/babel'],
}
```

Or, for `jest`:

```javascript
const { jest: jestConfig } = require('@interaktiv/dia-scripts/config');

module.exports = Object.assign(jestConfig, {
  // Your overrides here ...

  // For test written in Typescript, add:
  transform: {
    '\\.(ts|tsx)$': '<rootDir>/node_modules/ts-jest/preprocessor.js',
  },
});
```

> 📌 **Note:** `dia-scripts` intentionally does not merge things for you when
> you start configuring things to make it less magical and more straightforward.
> Extending can take place on your terms.

### Flow Support

If the [flow-bin][flow] is a dependency on the project the `@babel/preset-flow`
will automatically get loaded when you use the default babel config that comes
with `dia-scripts`. If you customized your `.babelrc`-file you might need to
manually add `@babel/preset-flow` to the `presets`-section.

## Other Solutions

We are not aware of any, if you are please [make a pull request][pull-requests]
and add it here!

Please consult the [contribution guides][contributing] before contributing.

## Other Use Cases

If you lack some use cases / scripts, you are welcome to [open a pull
request][pull-requests] and add it. We'll come back to you and see how we can
support your use case and present it to all devs.

Please consult the [contribution guides][contributing] before contributing.

## Acknowledgements

This tool is inspired by [kcd-scripts][] from [Kent C. Dodds][kentcdodds]. Here
are some of his blogs regarding toolkits and [kcd-scripts][]:

- [Tools without config][tools-without-config]
- [Concerning toolkits][concerning-toolkits]
- [How toolkits (like react-scripts) work - YouTube
  Video][how-toolkits-work-video]
- [paypal-scripts now supports TypeScript as well as
  Javascript][paypal-scripts-blog-post]

<!-- ## Contributors

Thanks goes to these people ([emoji key][emojis]): -->

<!-- ALL-CONTRIBUTORS-LIST:START - Do not remove or modify this section -->
<!-- prettier-ignore -->
<!-- ALL-CONTRIBUTORS-LIST:END -->

<!-- This project follows the [all-contributors][all-contributors] specification.
Contributions of any kind welcome! -->

## License

[MIT][license] Copyright © 2019-present [die.interaktiven GmbH & Co.
KG][dia-website]

[all-contributors]: https://github.com/kentcdodds/all-contributors
[all-contributors-spec]: https://allcontributors.org/docs/en/specification
[bitbucket]: https://bitbucket.org
[bitbucket-use-ssh]:
  https://confluence.atlassian.com/bitbucket/ssh-keys-935365775.html
[bitbucket-ssh-key-setup]:
  https://confluence.atlassian.com/bitbucket/set-up-an-ssh-key-728138079.html
[coc-badge]: https://img.shields.io/badge/code%20of-conduct-ff69b4.svg
[coc]: ./other/CODE_OF_CONDUCT.md
[commitizen]: http://commitizen.github.io/cz-cli
[commitizen-badge]:
  https://img.shields.io/badge/commitizen-friendly-brightgreen.svg
[concerning-toolkits]:
  https://blog.kentcdodds.com/concerning-toolkits-4db57296e1c3
[contributing]: ./CONTRIBUTING.md
[contributors]: #contributors
[contributors-badge]: https://img.shields.io/badge/contributors-all-orange.svg
[conventional-commits]: https://conventionalcommits.org
[conventional-commits-badge]:
  https://img.shields.io/badge/Conventional%20Commits-1.0.0-yellow.svg
[devdependencies]:
  https://docs.npmjs.com/specifying-dependencies-and-devdependencies-in-a-package-json-file
[dia-scripts]: https://bitbucket.org/dieinteraktiven/dia-scripts
[dia-website]: https://die-interaktiven.de
[downloads-badge]: https://img.shields.io/npm/dw/@interaktiv/dia-scripts.svg
[downloads-total-badge]:
  https://img.shields.io/npm/dt/@interaktiv/dia-scripts.svg
[eslint]: https://eslint.org
[emojis]: https://github.com/dia/all-contributors#emoji-key
[flow]: https://flow.org
[how-toolkits-work-video]: https://www.youtube.com/watch?v=ZWfY-v1DCTE
[issues]: https://interaktiv.jira.com/projects/DS/issues
[jest]: https://jestjs.io
[kcd-scripts]: https://github.com/kentcdodds/kcd-scripts
[kentcdodds]: https://kentcdodds.com
[latest-version-badge]:
  https://img.shields.io/npm/v/@interaktiv/dia-scripts/latest.svg
[license]: https://opensource.org/licenses/MIT
[license-badge]: https://img.shields.io/npm/l/@interaktiv/dia-scripts.svg
[next-version-badge]:
  https://img.shields.io/npm/v/@interaktiv/dia-scripts/next.svg
[package]: https://npmjs.com/package/@interaktiv/dia-scripts
[node]: https://nodejs.org
[npm]: https://www.npmjs.com
[npm-cli]: https://www.npmjs.com/package/npm
[npm-run-scripts]: https://docs.npmjs.com/misc/scripts
[paypal-dev-twitter]: https://twitter.com/paypaldev
[paypal-scripts-blog-post]:
  https://medium.com/paypal-engineering/why-every-new-web-app-at-paypal-starts-with-typescript-9d1acc07c839
[semantic-release]: https://github.com/semantic-release/semantic-release
[semantic-release-badge]:
  https://img.shields.io/badge/%20%20%F0%9F%93%A6%F0%9F%9A%80-semantic--release-e10079.svg
[tools-without-config]:
  https://blog.kentcdodds.com/automation-without-config-412ab5e47229
[version-badge]: https://img.shields.io/npm/v/@interaktiv/dia-scripts.svg