Improve the UX of using an npm installed formatter

[sindresorhus]

This is currently what you have to write to use a custom npm installed formatter with ESLint:

$ eslint --format=node_modules/eslint-formatter-unicorn file.js

That's not very user-friendly.

I propose the following:

1. Make getFormatter() try to require the formatter from cwd first. That way you could just do:

$ eslint --format=eslint-formatter-unicorn file.js

2. Make it possible to omit the eslint-formatter prefix. This matches the convention for shareable configs. This combined with 1. would mean you could just do:

$ eslint --format=unicorn file.js

Much nicer! ✨

I would also document the recommendation of using the eslintformatter keyword in package.json, like you do with shareable configs. This would make it easier for users to find third-party formatters.

[platinumazure]

@sindresorhus To be clear, you are looking for this enhancement in CLIEngine and the CLI interface, if possible?

[sindresorhus]

@platinumazure Yes, more specifically, in CLIEngine.getFormatter.

[ilyavolodin]

I was wondering if we should instead add formatters to be distributed through plugins? Formatters are the only thing we currently have that we don't have a recommended way of shearing.

[nzakas]

I fear this is more complicated than it looks. That said, @sindresorhus if you want to volunteer to investigate feasibility, we can consider it.

[sindresorhus]

I've already looked into it, and doesn't seem that hard to me, unless I'm missing something.

I would just use resolve-from here and prepend eslint-formatter if missing.

Untested patch:

@@ -1,3 +1,5 @@
+var resolveFrom = require("resolve-from");
+
 CLIEngine.getFormatter = function(format) {

     var formatterPath;
@@ -11,13 +13,20 @@
         // replace \ with / for Windows compatibility
         format = format.replace(/\\/g, "/");

+        var cwd = this.options ? this.options.cwd : process.cwd();
+
         // if there's a slash, then it's a file
         if (format.indexOf("/") > -1) {
-            var cwd = this.options ? this.options.cwd : process.cwd();

             formatterPath = path.resolve(cwd, format);
         } else {
-            formatterPath = "./formatters/" + format;
+            var npmFormat = /^eslint-formatter-/.test(format) ? format : "eslint-formatter-" + format;
+
+            formatterPath = resolveFrom(cwd, npmFormat);
+
+            if (!formatterPath) {
+                formatterPath = "./formatters/" + format;
+            }
         }

         try {

[nzakas]

I'd prefer not to add a second way to resolve modules (we already have a utility for that), but otherwise looks okay.

The next step would be to submit a pull request for the change. We'd need tests as well as documentation in order to merge.

[kaicataldo]

As per our discussion in today's TSC meeting, this issue has been added to the Core Roadmap.

[testower]

I forgot to mention, but I'm working on this one. It's in review.

[not-an-aardvark]

This was added in #9464.