15

After creating a new eslint-plugin for a custom rule, vue-cli-service build fails (eslint works as expected, when triggered by ./node_modules/.bin/eslint --ext .js,.vue,.json ./ --max-warnings=0).

GitHub repository reproducing issue

Starting in an environment with a working vue-cli-service build, following the simplified instructions at https://blog.webiny.com/create-custom-eslint-rules-in-2-minutes-e3d41cb6a9a0, also reproduces the issue. Running vue-cli-service build after every step, it starts failing after step 4: yarn add --dev file:./eslint, and the build still fails after all the steps are completed.

Error message:

ERROR  Failed to compile with 32 errors      

Module build failed (from ./node_modules/@vue/cli-plugin-eslint/node_modules/eslint-loader/index.js):
TypeError: eslint.CLIEngine is not a constructor
   at Object.module.exports (MYPATH/node_modules/@vue/cli-plugin-eslint/node_modules/eslint-loader/index.js:223:27)

***repeats 31 more times***

You may use special comments to disable some warnings.
Use // eslint-disable-next-line to ignore the next line.
Use /* eslint-disable */ to ignore all warnings in a file.
ERROR  Build failed with errors.
error Command failed with exit code 1.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.

vue-cli-service build stills fails after running yarn install, which says it is already up to date.

Most results for this specific TypeError: eslint.CLIEngine is not a constructor error claim the user should upgrade their JetBrains IDE. However, I am running vue-cli-service build on the command line and not using JetBrains.

The code referred to by the error message is (with preceding context):

MYPATH/node_modules/@vue/cli-plugin-eslint/node_modules/eslint-loader/index.js

...
var config = assign(
    // loader defaults
    {
      cacheIdentifier: JSON.stringify({
        "eslint-loader": pkg.version,
        eslint: eslintVersion || "unknown version"
      }),
      eslintPath: "eslint"
    },
    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;

  delete config.cacheIdentifier;

  // Create the engine only once per config
  var configHash = objectHash(config);

  if (!engines[configHash]) {
    var eslint = require(config.eslintPath);
    engines[configHash] = new eslint.CLIEngine(config); //Error happens here
  }
...

Edit: I upgraded @vue/cli-plugin-eslint from version 3.11.0 to 4.1.2 by editing yarn's package.json, at the suggestion of @DelenaMalan below. The build still fails with error:

ERROR  Failed to compile with 1 errors                                                                                                            7:51:01 PM

Module build failed (from ./node_modules/@vue/cli-service/node_modules/thread-loader/dist/cjs.js):
Thread Loader (Worker 0)
eslint.CLIEngine is not a constructor
    at PoolWorker.fromErrorObj (MYPATH/node_modules/@vue/cli-service/node_modules/thread-loader/dist/WorkerPool.js:262:12)
    at MYPATH/node_modules/@vue/cli-service/node_modules/thread-loader/dist/WorkerPool.js:204:29
    at mapSeries (MYPATH/node_modules/neo-async/async.js:3625:14)
    at PoolWorker.onWorkerMessage (MYPATH/node_modules/@vue/cli-service/node_modules/thread-loader/dist/WorkerPool.js:170:35)
    at readBuffer (MYPATH/node_modules/@vue/cli-service/node_modules/thread-loader/dist/WorkerPool.js:152:14)
    at Object.module.exports (MYPATH/node_modules/@vue/cli-plugin-eslint/node_modules/eslint-loader/index.js:223:27)

You may use special comments to disable some warnings.
Use // eslint-disable-next-line to ignore the next line.
Use /* eslint-disable */ to ignore all warnings in a file.
 ERROR  Build failed with errors.
error Command failed with exit code 1.

Edit 2: I deleted and reinstalled the node modules on the repro linked here, as recommended by @CGundlach, but I still have the eslint.CLIEngine is not a constructor error

Annas-MacBook-Pro:eslint-test-project anna$ rm -rf node_modules/
Annas-MacBook-Pro:eslint-test-project anna$ yarn install
yarn install v1.21.1
[1/4] 🔍  Resolving packages...
[2/4] 🚚  Fetching packages...
[3/4] 🔗  Linking dependencies...
warning "@vue/eslint-config-airbnb > [email protected]" has unmet peer dependency "webpack@>=1.11.0".
[4/4] 🔨  Building fresh packages...
✨  Done in 14.14s.
Annas-MacBook-Pro:eslint-test-project anna$ yarn build
yarn run v1.21.1
$ vue-cli-service build

⠏  Building for production...

 ERROR  Failed to compile with 1 errors                                                                                                           12:28:32 PM

Module build failed (from ./node_modules/thread-loader/dist/cjs.js):
Thread Loader (Worker 0)
eslint.CLIEngine is not a constructor
    at PoolWorker.fromErrorObj (/Users/anna/projects/yarn-vue-eslint/eslint-test-project/node_modules/thread-loader/dist/WorkerPool.js:262:12)
    at /Users/anna/projects/yarn-vue-eslint/eslint-test-project/node_modules/thread-loader/dist/WorkerPool.js:204:29
    at mapSeries (/Users/anna/projects/yarn-vue-eslint/eslint-test-project/node_modules/neo-async/async.js:3625:14)
    at PoolWorker.onWorkerMessage (/Users/anna/projects/yarn-vue-eslint/eslint-test-project/node_modules/thread-loader/dist/WorkerPool.js:170:35)
    at readBuffer (/Users/anna/projects/yarn-vue-eslint/eslint-test-project/node_modules/thread-loader/dist/WorkerPool.js:152:14)
    at Object.module.exports (/Users/anna/projects/yarn-vue-eslint/eslint-test-project/node_modules/eslint-loader/index.js:223:27)

You may use special comments to disable some warnings.
Use // eslint-disable-next-line to ignore the next line.
Use /* eslint-disable */ to ignore all warnings in a file.
 ERROR  Build failed with errors.
error Command failed with exit code 1.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.
8
  • I understand that you have tried to update the plugin with yarn install, but that command doesn't update a dependency (yarn upgrade does). Maybe just double check that you do have the latest version of the plugin by running yarn list | grep "@vue/cli-plugin-eslint" (the latest version at the moment is 4.1.2).
    – D Malan
    Commented Jan 16, 2020 at 14:46
  • 1
    @DelenaMalan I upgraded @vue/cli-plugin-eslint from version 3.11.0 to 4.1.2 by editing yarn's package.json and my build still fails. I've updated the question with the error. I verified my manual upgrade was successful by grepping yarn list again, which confirms I am now on version 4.1.2.
    – Anna
    Commented Jan 17, 2020 at 11:27
  • 2
    Can't reproduce this. I've created a new vue project with vue create eslint-test-project, then followed the steps outlined in the tutorial you linked and finally ran the build service with npx vue-cli-service build. Although I'm using NPM and not yarn, so that may be an error source. Can you provide a repo which showcases the bug for some more debugging?
    – CGundlach
    Commented Jan 21, 2020 at 16:44
  • I have now added a link to a github repo reproducing the issue to the question. The exact error message that repo produces (still including eslint.CLIEngine is not a constructor) is listed in its README.
    – Anna
    Commented Jan 28, 2020 at 10:46
  • 1
    When I download your repo, run yarn install and yarn build, the build goes through successfully. Have you tried deleting your node_modules-folder and rebuilding it with yarn install? Weirdly enough, the package eslint is missing in your yarn.lock, despite being in package.json and being installed when running yarn install.
    – CGundlach
    Commented Jan 28, 2020 at 13:57

1 Answer 1

4

Make sure all warnings are resolved when you run either npm ci, npm i or yarn install. For me the following warnings were showed after doing a fresh install:

$ vue-cli-service build

⠧  Building for production...

 ERROR  Failed to compile with 1 error                           20:47:55

Syntax Error: Thread Loader (Worker 0)
eslint.CLIEngine is not a constructor


You may use special comments to disable some warnings.
Use // eslint-disable-next-line to ignore the next line.
Use /* eslint-disable */ to ignore all warnings in a file.

When I did a fresh install and resolved the peer dependency issue by decreasing my eslint version everything works as expected.

So try to downgrade your eslint dependency to the correct version. For me I had to downgrade to eslint < 7.0.0.

npm i -D [email protected]
# or yarn
yarn add -D [email protected]

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.