Migrating to ESLint

Archived

This page is an archive of the work completed in July 2016 to use eslint to enforce code quality / style. As of 2021, VexFlow still uses eslint. See: .eslintrc

---

Currently VexFlow is in the process of migrating to eslint. Using a much stricter config than the previous jshint config provided.

• Currently completed files
• Discussion

Using eslint

You have two options:

Running grunt eslint will run eslint on all the ESLINT_SOURCES expected to pass in the Gruntfile. You could just add a failing file to that array.

Or you can run eslint independently of grunt:

cd <vexflow root>
npm install
eslint <path>

Basic Steps

UPDATE: On master, the first two steps have been run on each file. Only manual edits remain

1. Run code through Lebab with lebab <filepath> -o <filepath>

• Lebab is an ES5 to ES6 converter.
• You can install it with npm.
• It seems to work quite well, but be sure to review the result because some transforms are unsafe.

2. Run eslint --fix

• This will fix some pretty trivial things, but definitely saves time.

3. Manual edits

• Despite the automated bits, many errors will remain.
• Sometimes minor refactoring will be required

4. When finished add the file name to the ESLINT_SOURCES array in the Gruntfile

Config

Config located here: https://github.com/0xfe/vexflow/blob/master/.eslintrc.json

Acquaint yourself with the eslint rules and feel free to make suggestions. Note that we're extending the eslint-config-airbnb-base

Complete

• accidental.js
• annotation.js
• articulation.js
• barnote.js
• beam.js
• bend.js
• boundingbox.js
• boundingboxcomputation.js
• canvascontext.js
• clef.js
• clefnote.js
• crescendo.js
• curve.js
• dot.js
• formatter.js
• fraction.js
• frethandfinger.js
• ghostnote.js
• glyph.js
• gracenote.js
• gracenotegroup.js
• index.js
• keymanager.js
• keysignature.js
• modifier.js
• modifiercontext.js
• music.js
• note.js
• notehead.js
• ornament.js
• pedalmarking.js
• raphaelcontext.js
• renderer.js
• stave.js
• stavebarline.js
• staveconnector.js
• stavehairpin.js
• staveline.js
• stavemodifier.js
• stavenote.js
• staverepetition.js
• stavesection.js
• stavetempo.js
• stavetext.js
• stavetie.js
• stavevolta.js
• stem.js
• stemmablenote.js
• stringnumber.js
• strokes.js
• svgcontext.js
• tables.js
• tabnote.js
• tabslide.js
• tabstave.js
• tabtie.js
• textbracket.js
• textdynamics.js
• textnote.js
• tickable.js
• tickcontext.js
• timesignature.js
• timesignote.js
• tremolo.js
• tuning.js
• tuplet.js
• vex.js
• vibrato.js
• voice.js
• voicegroup.js