create-react-app linting setup with 'standard' style

README.md

Setup Your Machine

NOTE: You only need to do these steps once on your machine

• Install ESlint globally on your machine: npm install -g eslint

• Make sure you have nvm installed. This is a way to handle multiple versions of Node on your machine. If you're not sure you have it, try running nvm in Terminal. If you get a help file, you have nvm! If not, run this command to install it:

curl -o- https://raw.githubusercontent.com/creationix/nvm/v0.33.1/install.sh | bash

• Install ESLint in your editor of choice.

  • Note: if you already have SublimeLinter installed, you may need to disable the contributed linter package you normally use in order for the rest of this to work.
    • To do this, use cmd + shift + P to open Package Control. Start typing Disable Package and select it when it shows up. Find the contributed linter package, e.g. SublimeLinter-contrib-standard and select it to disable the package. You can always turn it back on by running the Enable Package command in Package Control later.
  • Use cmd + shift + P to open Package Control in Sublime Text. If you don't have Package Control installed, go here.
  • search for SublimeLinter and hit 'Enter' to install
  • In Sublime's Menus, go to Sublime Text -> Prefences -> Package Settings -> SublimeLinter -> Settings-User
  • In here, you have to tell Sublime-Linter where your node is installed using the paths option. You can do this by running which node on the command line. For example if you use nvm your config would look like this:

  "paths": {
    "linux": [],
    "osx": [
      "/Users/matthewepler/.nvm/versions/node/v6.3.1/bin/node"
    ],
    "windows": []
  },
  

• Install Babel syntax highlighting for your editor of choice. Follow instructions here.

• If using Sublime and you have previously installed the Sublimelinter-contrib-standard package, disable it before proceeding.

• [optional] install StandardFormat to automatically format your files when you save them. This is great if you are using create-react-app and don't want to manually edit all the semi-colons and double-quotes when you first open the files in your app. Personally, I use it to clean up all the files and then turn it off by disabling the package so that I don't get lazy about my formatting.

Setup Your Project

• run create-react-app to create your project, then cd into the project directory.

  • Details on supported features and FAQs for create-react-app here.

• Install eslint locally and the 'standard' linter packages: npm install --save-dev eslint standard eslint-config-standard eslint-config-standard-react eslint-plugin-promise eslint-plugin-react eslint-plugin-standard

  • see this repo for reference

• Create .eslintrc file at the project root, copy and paste these setting:

{
  "extends": ["standard", "standard-react"]
}

** Or include in our npm package by default and install with npm install -- TO DO --

?! - roll our own and keep up with create-react-app for additions we might use...

• next steps:

• eject and see if that fixes the problem YES - keep it NO - go back to create-react-app and try again using these instructions

  didn't see any other eslintrc files in the app structure. they must be buried in the node_modules folder. Mine isn't overriding them.