Skip to content

JS Guidelines

Mateus Moraes edited this page Aug 20, 2016 · 15 revisions

JS Guidelines

All javascript files in the storefront folder should be coded in plain javascript using ES6 syntax. Note that only js files contained in this folder will be transpiled to ES5. All other js files will need to use ES5 syntax, no CoffeeScript, please.

Dependencies

First install nodejs: (https://nodejs.org/en/)

Install node dependencies:

npm install

Compile

Compile with:

gulp

Output file

This will produce browserified bundle file located here: app/assets/javascripts/application_bundle.js

Source files

All source files are located in this folder: app/assets/javascripts/storefront/

Linting

All new js scripts should be linted, note that eslint config file expects ES6 syntax so you will most likely get some warnings, this is expected, just ignore them and focus on error.

Linting IDE setup

You will only need to install a few packages to make it work. This will allow you to immediately fix all errors and warnings as you type your code rather that do it in one go at the end of dev process.

Atom

You will need to add these two packages [linter, linter-eslint], if you don't know how to add packages, follow the guide bellow:

(http://flight-manual.atom.io/using-atom/sections/atom-packages/)

Other editors

For all other editors follow the integration guide bellow:

(http://eslint.org/docs/user-guide/integrations)

Linting using gulp

Note that only files inside of the storefront folder will be linted.

gulp lint