Display message if no ESLint configuration is found

Author: Kocal

lib/loaders/eslint.js

@@ -13,6 +13,14 @@ const WebpackConfig = require('../WebpackConfig'); //eslint-disable-line no-unus
 const loaderFeatures = require('../features');
 const applyOptionsCallback = require('../utils/apply-options-callback');
 
+function isMissingConfigError(e) {
+    if (!e.message || !e.message.includes('No ESLint configuration found')) {
+        return false;
+    }
+
+    return true;
+}
+
 module.exports = {
     /**
      * @param {WebpackConfig} webpackConfig
@@ -21,6 +29,40 @@ module.exports = {
     getOptions(webpackConfig) {
         loaderFeatures.ensurePackagesExistAndAreCorrectVersion('eslint');
 
+        const eslint = require('eslint'); // eslint-disable-line node/no-unpublished-require
+        const engine = new eslint.CLIEngine({
+            cwd: webpackConfig.runtimeConfig.context,
+        });
+
+        try {
+            engine.config.getConfigHierarchy(webpackConfig.runtimeConfig.context);
+        } catch (e) {
+            if (isMissingConfigError(e)) {
+                const chalk = require('chalk').default;
+                const packageHelper = require('../package-helper');
+
+                const message = `No ESLint configration has been found.
+
+${chalk.bgGreen.black('', 'FIX', '')} Run command ${chalk.yellow('./node_modules/.bin/eslint --init')} or create manually a ${chalk.yellow('.eslintrc.js')} file at the root of your project.
+
+If you prefer to create a ${chalk.yellow('.eslintrc.js')} file by yourself, here is an example to get you started!
+
+Install ${chalk.yellow('babel-eslint')} to prevent potential parsing issues with your code: ${packageHelper.getInstallCommand([[{ name: 'babel-eslint' }]])}
+
+And then create the following file:
+
+${chalk.yellow(`// .eslintrc.js
+module.exports = {
+    parser: 'babel-eslint',
+    extends: ['eslint:recommended'],
+}
+`)}`;
+                throw new Error(message);
+            }
+
+            throw e;
+        }
+
         const eslintLoaderOptions = {
             cache: true,
             emitWarning: true

lib/package-helper.js

@@ -195,4 +195,5 @@ module.exports = {
     getMissingPackageRecommendations,
     getInvalidPackageVersionRecommendations,
     addPackagesVersionConstraint,
+    getInstallCommand,
 };

test/functional.js

@@ -9,6 +9,7 @@
 
 'use strict';
 
+const os = require('os');
 const chai = require('chai');
 chai.use(require('chai-fs'));
 const expect = chai.expect;
@@ -1763,6 +1764,32 @@ module.exports = {
             }, true);
         });
 
+        it('When enabled and without any configuration, ESLint will throw an error and a nice message should be displayed', (done) => {
+            const cwd = process.cwd();
+
+            this.timeout(5000);
+            setTimeout(() => {
+                process.chdir(cwd);
+                done();
+            }, 4000);
+
+            const appDir = testSetup.createTestAppDir(os.tmpdir()); // to prevent issue with Encore's .eslintrc.js
+            const config = testSetup.createWebpackConfig(appDir, 'www/build', 'dev');
+            config.setPublicPath('/build');
+            config.addEntry('main', './js/eslint');
+            config.enableEslintLoader({
+                // Force eslint-loader to output errors instead of sometimes
+                // using warnings (see: https://github.com/MoOx/eslint-loader#errors-and-warning)
+                emitError: true,
+            });
+
+            process.chdir(appDir);
+
+            expect(() => {
+                testSetup.runWebpack(config, (webpackAssert, stats) => {});
+            }).to.throw('No ESLint configration has been found.');
+        });
+
         it('Code splitting with dynamic import', (done) => {
             const config = createWebpackConfig('www/build', 'dev');
             config.setPublicPath('/build');

test/helpers/setup.js

@@ -25,8 +25,8 @@ const testFixturesDir = path.join(__dirname, '../', '../', 'fixtures');
 
 let servers = [];
 
-function createTestAppDir() {
-    const testAppDir = path.join(tmpDir, Math.random().toString(36).substring(7));
+function createTestAppDir(rootDir = tmpDir) {
+    const testAppDir = path.join(rootDir, Math.random().toString(36).substring(7));
 
     // copy the fixtures into this new directory
     fs.copySync(testFixturesDir, testAppDir);