eslint-config-with-prettier.sh

#!/bin/bash

# bash script that can setup environment with common linting and testing tools

yes="${@}"

function yes_or_no {
  if [[ $yes == "-y" ]]; then
    echo "🛑👍🛑 !!! skipping question !!! 🛑👍🛑"
  else
    while true; do
      read -p "$* [y/n]: " yn
      case $yn in
        [Yy]*) return 0 ;;
        [Nn]*) echo "👍 install aborted" ; return  1 ;;
      esac
    done
  fi
}

echo "🛑🛑🛑 !!!on your own risk!!! 🛑🛑🛑,
💡 commit before running the script and control the output using diff in version control."

yes_or_no "I have done the git commit and I want to continue." || exit 1 

function editorconfig {
echo "👍 .editorconfig added"

echo "# EditorConfig: http://EditorConfig.org
# EditorConfig Properties: https://github.com/editorconfig/editorconfig/wiki/EditorConfig-Properties

# top-most EditorConfig file
root = true

### defaults
[*]
charset = utf-8

# Unix-style newlines with
end_of_line = lf

# Max line length
max_line_length=80

# 2 space indentation
indent_size = 2
indent_style = space

# remove any whitespace characters preceding newline characters
trim_trailing_whitespace = true

# newline ending every file
insert_final_newline = true

# Denotes preferred quoting style for string literals
quote_type = double

### custom for markdown
[*.md]
# do not remove any whitespace characters preceding newline characters
trim_trailing_whitespace = false" > .editorconfig
}

editorconfig

function babelrc {
echo "👍 .babelrc added"
yarn add --dev --exact @babel/cli babel-core@^7.0.0-bridge.0 @babel/core @babel/preset-env @babel/preset-react @babel/preset-flow babel-jest regenerator-runtime


echo '{
  // An important note is that babelrc does not merge presets or plugins
  "presets": [
    ["@babel/preset-env",
      {
        "targets": "> 0.25%, not dead"
      }
    ],
    "@babel/preset-react",
    "@babel/preset-flow"
  ],
  "plugins": [
    // "babel-plugin-emotion", // yarn add emotion react-emotion && yarn add babel-plugin-emotion --dev --exact
    // ["babel-plugin-styled-components", { "displayName": true }] // yarn add styled-components && yarn add babel-plugin-emotion --dev --exact
    
  ],
  "env": {
    "production": {
      "plugins": [
        "lodash"
      ]
    },
    "development": {
      "plugins": [
        "react-hot-loader/babel"
      ]
    },
    "test": {
      "presets": [
        [
          "@babel/env",
          {
            "targets": {
                "node": "current"
            }
          }
        ],
        "@babel/preset-react",
        "@babel/preset-flow"
      ],
      "compact": false
    }
  }
}' > .babelrc
}

if [ ! -f .babelrc ]; then
  babelrc
else
  yes_or_no "💡 .babelrc exist do you want override it" && babelrc
fi

function eslintrc {
echo "👍 .eslintrc.yml added"

echo '---
extends:
  - eslint-config-with-prettier
    
rules:
' > .eslintrc.yml
}

if [ ! -f ".eslintrc.yml" ]; then
  eslintrc
else
  yes_or_no "💡 .eslintrc.yml exist do you want override it" && eslintrc
fi

function eslintignore {
echo "👍 .eslintignore added"
echo "flow-typed/npm/**
coverage/**
dist/**
.history/**
.next/**
.vscode/**
.idea/**
" > .eslintignore
}

if [ ! -f .eslintignore ]; then
  eslintignore
else
  yes_or_no "💡 .eslintignore exist do you want override it" && eslintignore
fi


function prettierrc {
echo "👍 .prettierrc added"
echo "trailingComma: all
bracketSpacing: false
" > .prettierrc
}

if [ ! -f .prettierrc ]; then
  prettierrc
else
  yes_or_no "💡 .prettierrc exist do you want override it" && prettierrc
fi

function prettierignore {
echo "👍 .prettierignore added"
echo "package.json
package-lock.json
flow-typed/npm/**
" > .prettierignore
}

if [ ! -f .prettierignore ]; then
  prettierignore
else
  yes_or_no "💡 .prettierignore exist do you want override it" && prettierignore
fi


function flowconfig {
echo "👍 .flowconfig added"
echo "[ignore]

<PROJECT_ROOT>/.idea/.*

[include]

[libs]
flow-typed

[options]
emoji=true
" > .flowconfig
}

function gitignore {
  echo "👍 .gitingore added"

  commonGitIgnore=$(curl -s https://www.gitignore.io/api/archive,macos,linux,windows,node,jetbrains,sublimetext,eclipse,netbeans,visualstudiocode)
  currentGitIgnore=$(cat .gitignore)

echo "$commonGitIgnore

### Custom .gitignore

/flow-typed/npm
flow-coverage
dist
$currentGitIgnore" > .gitignore

}

grep -q www.gitignore.io .gitignore || gitignore

yarn add --dev --exact eslint jest husky lint-staged prettier imagemin-lint-staged 

packagejson=$(cat package.json)
addtopackagejson=$(echo '{
  "scripts": {
    "test": "jest",
    "test:changed": "yarn test --onlyChanged --passWithNoTests --silent --runInBand",
    "test:watch": "yarn test --watch",
    "test:update": "yarn test --update",
    "test:coverage": "yarn test --coverage --verbose --silent --runInBand --passWithNoTests",
    "lint": "eslint . --cache",
    "lint:fix": "yarn lint --fix",
    "lint:img": "find src -iname '*.gif' -o -iname '*.jpg' -o -iname '*.png' -o -iname '*.jpeg' -o -iname '*.svg' | xargs imagemin-lint-staged",
    "lint:staged": "eslint --fix --max-warnings=0",
    "prettier": "prettier --write *.{js,jsx,html,md,mdx,yaml,json,css,scss,less}",
    "precommit": "lint-staged && yarn test:changed",
    "prepush": "yarn test:coverage"
  },
  "husky": {
    "hooks": {
      "pre-commit": "yarn precommit",
      "pre-push": "yarn prepush"
    }
  },
  "lint-staged": {
    "linters": {
      "*.{js,jsx}": [
        "yarn run lint:staged",
        "git add"
      ],
      "*.{html,md,mdx,yaml,json,css,scss,less}": [
        "prettier --write",
        "git add"
      ],
      "*.{png,jpeg,jpg,gif,svg}": [
        "imagemin-lint-staged",
        "git add"
      ]
    }
  }
}')

echo "👍 package.json added with linting and testing"
echo "$addtopackagejson
$packagejson" | ./node_modules/.bin/json --deep-merge > package.json

function enzyme {
  yarn add --dev enzyme enzyme-adapter-react-16 enzyme-react-intl enzyme-to-json react-test-renderer

  packagejson=$(cat package.json)
  addtopackagejson=$(echo '{
  "jest": {
    "snapshotSerializers": ["enzyme-to-json/serializer"],
    "setupFiles": ["raf/polyfill", "<rootDir>/jest.setup.js"]
  }
}')

  echo "👍 package.json added with enzyme snapshotSerializers"
  echo "$addtopackagejson
  $packagejson" | ./node_modules/.bin/json --deep-merge > package.json

  echo 'import Enzyme from "enzyme";
import Adapter from "enzyme-adapter-react-16";
// React 16 Enzyme adapter
Enzyme.configure({adapter: new Adapter()});
' > jest.setup.js
}

yes_or_no "👌 Do you want to use enzyme for Component testing?" && enzyme

function flow {
  yarn add --dev flow-bin flow-typed flow-coverage-report

  packagejson=$(cat package.json)
  addtopackagejson=$(echo '{
    "scripts": {
      "flow:setup": "yarn && flow-typed install",
      "flow:update": "flow-typed update",
      "flow": "flow",
      "flow:errors": "flow --show-all-errors",
      "flow:coverage": "flow coverage ./src/index.js --color && flow-coverage-report -i 'src/**/*.js' -x 'src/**/*.test.js' -x 'src/**/*.spec.js' -t html",
      "prepush": "yarn test:coverage && yarn run flow:errors"
    }
  }')

  echo "👍 package.json added with flow scripts"
  echo "$addtopackagejson
  $packagejson" | ./node_modules/.bin/json --deep-merge > package.json

  yarn run flow:setup

  if [ ! -f .flowconfig ]; then
    flowconfig
  else
    yes_or_no "💡 .flowconfig exist do you want override it" && flowconfig
  fi
}

yes_or_no "👌 Do you want to use setup flow?" && flow

echo "🏁 thanks for running the script now check output using version control"