How to set ESlint to understand the p5.js library calls and not flag them as undefined.

edited February 2018 in p5.js

Hi folks,

Just trying ESlint on some simple p5.js code. It spits out a long list like ...

26:3 error 'createCanvas' is not defined no-undef
29:3 error 'colorMode' is not defined no-undef
29:13 error 'HSB' is not defined no-undef
36:13 error 'random' is not defined no-undef
36:23 error 'width' is not defined no-undef
37:23 error 'height' is not defined no-undef

I see you can tell ESlint the symbols in known libraries .. examples here ..

https://eslint.org/docs/user-guide/configuring#specifying-environments

Can I specify a config file that tells ESlint the symbols (function calls like createCanvas(), globals like width) in p5.js ? and ignores them ?

Thanks, Greg E.

Tagged:

Answers

  • Answer ✓

    Few suggestions:

    (1) Use /* eslint no-undef: 0 */ at the top of your file. That will stop warnings for variables that are accessed but not defined within the same file. Example:
    /* eslint no-undef: 0 */ setup = function() { createCanvas(400, 400); } draw = function() { ellipse(width / 2, height / 2, 100); }

    (2) Define globals. Example:
    /* eslint no-unused-vars: 0 */ /* globals setup: true, draw: true, createCanvas, ellipse, width, height */ setup = function() { createCanvas(400, 400); } draw = function() { ellipse(width / 2, height / 2, 100); }

    (3) Use the globals key and define global variables in .eslintrc file for your project. Example:
    { .................. "globals": { "setup": true, "draw": true, "createCanvas": true, "ellipse": true, "width": true, ................... } }
    Refer to the eslint documentation about these true/false flags. Basically, they allow/disallow overwriting of the variables.

    Hope, the things above will be helpful.

  • Thanks Atoro, will try all that. I did see a lot of it in the ESlint doco but it's a bit terse. GE.

  • Atoro, that worked ok. Many thanks.

Sign In or Register to comment.