fix: try load official formatter (#285)

Author: ricardogobbosouza

README.md

@@ -107,11 +107,11 @@ This can either be a `boolean` value or the cache directory path(ex: `'./.eslint
 If `cache: true` is used, the cache file is written to the `./node_modules/.cache` directory.
 This is the recommended usage.
 
-#### `formatter` (default: eslint stylish formatter)
+#### `formatter` (default: "stylish")
 
 Loader accepts a function that will have one argument: an array of eslint messages (object).
 The function must return the output as a string.
-You can use official eslint formatters.
+You can use official [eslint formatters](https://eslint.org/docs/user-guide/formatters/).
 
 ```js
 module.exports = {
@@ -126,7 +126,7 @@ module.exports = {
           // several examples !
 
           // default value
-          formatter: require("eslint/lib/formatters/stylish"),
+          formatter: "stylish",
 
           // community formatter
           formatter: require("eslint-friendly-formatter"),
@@ -287,7 +287,7 @@ module.exports = {
         options: {
           outputReport: {
             filePath: "checkstyle.xml",
-            formatter: require("eslint/lib/formatters/checkstyle")
+            formatter: "checkstyle"
           }
         }
       }

index.js

@@ -195,21 +195,6 @@ module.exports = function(input, map) {
     userOptions
   );
 
-  if (typeof config.formatter === "string") {
-    try {
-      config.formatter = require(config.formatter);
-      if (
-        config.formatter &&
-        typeof config.formatter !== "function" &&
-        typeof config.formatter.default === "function"
-      ) {
-        config.formatter = config.formatter.default;
-      }
-    } catch (_) {
-      // ignored
-    }
-  }
-
   var cacheDirectory = config.cache;
   var cacheIdentifier = config.cacheIdentifier;
 
@@ -221,15 +206,36 @@ module.exports = function(input, map) {
   if (!engines[configHash]) {
     var eslint = require(config.eslintPath);
     engines[configHash] = new eslint.CLIEngine(config);
-  }
 
-  var engine = engines[configHash];
-  if (config.formatter == null || typeof config.formatter !== "function") {
-    config.formatter = engine.getFormatter("stylish");
+    // Try to get oficial formatter
+    if (typeof config.formatter === "string") {
+      try {
+        config.formatter = engines[configHash].getFormatter(config.formatter);
+      } catch (_) {
+        try {
+          config.formatter = require(config.formatter);
+          if (
+            config.formatter &&
+            typeof config.formatter !== "function" &&
+            typeof config.formatter.default === "function"
+          ) {
+            config.formatter = config.formatter.default;
+          }
+        } catch (_) {
+          // ignored
+        }
+      }
+    }
+
+    // Get default formatter `stylish` when not defined
+    if (config.formatter == null || typeof config.formatter !== "function") {
+      config.formatter = engines[configHash].getFormatter("stylish");
+    }
   }
 
   webpack.cacheable();
 
+  var engine = engines[configHash];
   var resourcePath = webpack.resourcePath;
   var cwd = process.cwd();
 

test/formatter-official.js

@@ -0,0 +1,37 @@
+/* eslint-disable no-console */
+var test = require("ava");
+var webpack = require("webpack");
+
+var conf = require("./utils/conf");
+
+test.cb("eslint-loader can use official formatter", function(t) {
+  t.plan(1);
+  webpack(
+    conf(
+      {
+        entry: "./test/fixtures/error.js"
+      },
+      {
+        formatter: "table"
+      }
+    ),
+    function(err, stats) {
+      if (err) {
+        throw err;
+      }
+
+      // console.log("### Here is a example of official formatter")
+      // console.log(
+      //   "# " +
+      //   stats.compilation.errors[0].message
+      //     .split("\n")
+      //     .join("\n# ")
+      // )
+      t.truthy(
+        stats.compilation.errors[0].message,
+        "webpack have some output with official formatter"
+      );
+      t.end();
+    }
+  );
+});