Atom & Important packages - kanuku/misc GitHub Wiki

Enabling formatting & autocomplete for your projects

Step 1. Install the following packages for auto-complete and suggestions.

apm install language-babel.

Step 2. Install the following packages for formatting

apm install prettier-atom

after installation you can format a file by using Control + Option + f in Mac.

Step 1. Enable autocomplete by associating file with the jsx language

There are 2 ways to associate *.js files with the Babel plugin:

1. When you open a js file, then double-click in the bottom-right-tab and switch from Javascript to Babel ES6 Javascript (source.js.jx) and the autocomplete should work. You can test by typing <h and the options should appear.
2. edit file ~/.atom/config.cson and add customFileTypes association for language source.js.jsx with any 'js' extention.

"*":
  "atom-beautify":
    general:
      _analyticsUserId: "b9ffc4a9-1180-49f1-8ba9-52d5298a738c"
    js:
      brace_style: "collapse-preserve-inline"
      disabled: true
    jsx:
      break_chained_methods: true
      disabled: true
      e4x: false
  "autocomplete-modules": {}
  core:
    customFileTypes:
      "source.js.jsx": [
        "js"
      ]
    disabledPackages: [
      "react"
    ]
    telemetryConsent: "limited"
  "exception-reporting":
    userId: "a4e8b3c4-d082-4a46-9682-03e2ba45974b"
  "language-babel":
    autoIndentJSX: true
  "linter-ui-default":
    showPanel: true
  "prettier-atom":
    formatOnSaveOptions:
      showInStatusBar: true

apm install atom-beautify react atom-react-autocomplete color-picker