Cannot read property 'version' of undefined

[joeirimpan]

Version

3.1.0

Node and OS info

Node v10.13.0 / npm 6.4.1

Steps to reproduce

npm install -g @vue/cli
npm install -g @vue/cli-service-global

What is expected?

vue serve should start the prototyping server

What is actually happening?

(node:15758) UnhandledPromiseRejectionWarning: TypeError: Cannot read property 'version' of undefined
at module.exports (/usr/local/lib/node_modules/@vue/cli-service-global/node_modules/@vue/cli-plugin-eslint/index.js:20:29)
at plugins.forEach (/usr/local/lib/node_modules/@vue/cli-service-global/node_modules/@vue/cli-service/lib/Service.js:79:7)
at Array.forEach ()
at Service.init (/usr/local/lib/node_modules/@vue/cli-service-global/node_modules/@vue/cli-service/lib/Service.js:78:18)
at Service.run (/usr/local/lib/node_modules/@vue/cli-service-global/node_modules/@vue/cli-service/lib/Service.js:204:10)
at Object.exports.serve (/usr/local/lib/node_modules/@vue/cli-service-global/index.js:54:33)
at Command.program.command.description.option.option.action (/usr/local/lib/node_modules/@vue/cli/bin/vue.js:104:53)
at Command.listener (/usr/local/lib/node_modules/@vue/cli/node_modules/commander/index.js:315:8)
at Command.emit (events.js:182:13)
at Command.parseArgs (/usr/local/lib/node_modules/@vue/cli/node_modules/commander/index.js:654:12)
(node:15758) UnhandledPromiseRejectionWarning: Unhandled promise rejection. This error originated either by throwing inside of an async function without a catch block, or by rejecting a promise which was not handled with .catch(). (rejection id: 1)
(node:15758) [DEP0018] DeprecationWarning: Unhandled promise rejections are deprecated. In the future, promise rejections that are not handled will terminate the Node.js process with a non-zero exit code.

---

Following this tutorial https://cli.vuejs.org/guide/prototyping.html

cli-plugin-eslint api directory getting resolved as current project directory https://github.com/vuejs/vue-cli/blob/dev/packages/%40vue/cli-plugin-eslint/index.js#L8 and so eslintPkg becomes undefined.

I added plugin to the current directory by vue add @vue/eslint and dev server started normally.

[pbastowski]

@sodatea

I'm having the same issue with vue serve. Is there a known workaround for this bug?

I am planning to use the zero config vue serve in a training next week, so, it's a bit of a surprise that it is no longer working.

[pbastowski]

The temporary solution is to use POI. It is just as easy as vue-cli to use, but works right this moment.

[joeirimpan]

Just do npm install eslint inside the project. It should work.

[SumNeuron]

@joeirimpan solves the issue, but how come?

[pbastowski]

@joeirimpan
Thanks. That's the only place I did not try installing eslint.
This moves in the right direction, but for me still complains about missing stylus-loader. And I'm not even using stylus or any special css pre-processor.

[sodatea]

Must be introduced by this commit c500512
I'll try to fix it asap.

[notdaniel]

Installing eslint locally works, but of course this still negates the instant prototyping feature.

[voyera]

Just do npm install eslint inside the project. It should work.

Thank you for that! Still curious as to why this solves the issue and why it's not documented.

[sodatea]

Fixed in the latest release. Please reinstall the @vue/cli-service-global package.

[pbastowski]

Thanks for the quick response, that fixed the issue with eslint.

[jnes92]

I also followed the tutorial on my windows machine with the same error description from above.

Im using Version 4.0.2 (+ @vue/cli-service-global@4.0.2) , installed today :O
Other versions: Node v10.8 / npm 6.2

I can later try using this on a mac. 👍

[OriginalEXE]

eslint is now a peer dependency so you need to install it yourself for the project:

npm install --save-dev eslint@5

[jnes92]

In Addition to @OriginalEXE I also needed to add those as local packages:

npm install eslint-plugin-vue
npm install babel-eslint

[OriginalEXE]

Indeed. Here is a full list of steps we did for a project:

• npm install -g @vue/cli
• npm install --save-dev eslint@5 babel-eslint eslint-plugin-vue (eslint is now a peer dependency)
• add 'vue/no-v-html': 'off' to the list of eslint rules (we are aware of the dangers, not recommended for those just starting out)
• Bump core-js to version 3 in babel.config.js

[pbastowski]

Is there a way to do zero-config vue serve with version 4.x without installing additional dependencies?

With vue-cli 3.x I just needed an App.vue file in an otherwise empty folder and I could immediately vue serve my one-file app.

With version 4.x and the same Vue.app I get an error instead: Cannot read property 'version' of undefined.

[sodatea]

Seems a bug. I may fix it tomorrow.

[gregpalaci]

adding eslint didnt fix
Got this
@vue/cli 4.0.4

    at add (/home/gnb/.nvm/versions/node/v12.12.0/lib/node_modules/@vue/cli/lib/add.js:23:35)

editing that line from if (semver.satisfies(servicePkg.version, '3.x')) { to if (true) lets the install happen but not a fix of course

[tfcx-th]

I am using @vue/cli 4.0.4 @vue/cli-service-global 4.0.4
Have the same issue and solved it by
npm install -D eslint eslint-plugin-vue babel-eslint

[mikizdr]

What a silly thing happen after crafting a new app. Do you all think it is all right and one should spend the time to find a fix for that? No one mentioned that something like that MUST NOT happen in dev env. If we talk about a serious project (like Vue is), vue create new-app MUST NOT have a problem at all for the start of scaffolding. My conclusion: not serious approach, everyone can't be involved in Vue core development and master admin should care about every PR (reject or resolve).
P.S. I didn't have such a problem before at all.

[pbastowski]

@mikizdr I reverted back to 3.12, which works perfectly as documented. I agree that getting the users to (unintentionally) test production releases is not the best approach. Perhaps adding automated tests around the major documented functionality could help prevent such issues in the future.

[mdiallo224]

So; This still an issue? I am just trying to create a web comp, eslint could be optional (nonsexist)
Fixed it for me vue add @vue/eslint

[sodatea]

@mikizdr @pbastowski @mdiallo224 I can't reproduce the bug with vue crete new-app. Don't this bug only happens when you run vue serve or vue build?

[sodatea]

@mikizdr To be fair Vue CLI v4 is in prerelease for half a year already. 6 alphas, 4 betas, 9 RCs, and not a single issue has been raised on this problem. We are definitely very serious about this project and not getting users to test production release. Bug happens, no matter how hard you try.

Of course, we should try to fix bugs as soon as possible and avoid silly problems to happen again.

But there are priorities. I didn't fix this one so soon because:

1. I didn't realize it's a bug until late Friday night in my timezone;
2. vue serve is not recommended for production use in our documentation https://cli.vuejs.org/guide/prototyping.html So I assume it doesn't break production apps;
3. There are workarounds in the above comments;
4. I've only just located the bug but not yet sure how to fix, it takes time to think about.

And, if you do have a solution, PR is welcome.

[gregpalaci]

So; This still an issue? I am just trying to create a web comp, eslint could be optional (nonsexist)
Fixed it for me vue add @vue/eslint

This didn't fix it for me (as per my above comment) but I'm using vue cli 4x

[gregpalaci]

@mikizdr To be fair Vue CLI v4 is in prerelease for half a year already. 6 alphas, 4 betas, 9 RCs, and not a single issue has been raised on this problem. We are definitely very serious about this project and not getting users to test production release. Bug happens, no matter how hard you try.

Of course, we should try to fix bugs as soon as possible and avoid silly problems to happen again.

But there are priorities. I didn't fix this one so soon because:

1. I didn't realize it's a bug until late Friday night in my timezone;

2. `vue serve` is not recommended for production use in our documentation https://cli.vuejs.org/guide/prototyping.html So I assume it doesn't break production apps;

3. There are workarounds in the above comments;

4. I've only just located the bug but not yet sure how to fix, it takes time to think about.

And, if you do have a solution, PR is welcome.

Just to clarify this happens when trying to add packages via the vue add jest for me not the serve.

[sodatea]

@gregbenner Does your project have a @vue/cli-service dependency? Vue CLI is not supposed to work in projects without this dependency.

[gregpalaci]

Sadly my linux broke as I was upgrading and lost all my work :( will let you know if i encounter this again in the future

I found a version and you are 100% right what the issue was @sodatea thank you kindly

[sodatea]

Fixed in 4.0.5 with this PR #4728

[AuspeXeu]

Problem still persists for me with the latest version.

...
  "devDependencies": {
    "@vue/cli-plugin-babel": "4.0.5",
    "@vue/cli-plugin-eslint": "4.0.5",
    "@vue/cli-service": "4.0.5",
    "@vue/eslint-config-airbnb": "4.0.1",
    "depcheck": "0.8.4",
    "husky": "3.0.9",
    "npm-check-updates": "3.1.26",
    "vue-cli-plugin-vuetify": "1.1.1",
    "vue-template-compiler": "2.6.10"
  },
...

[sodatea]

@AuspeXeu What's the output of vue --version and vue info?

[AuspeXeu]

auspexDESKTOP:~/repos$ vue --version
3.12.1
auspex@DESKTOP:~/repos$ vue info

Environment Info:

  System:
    OS: Linux 4.4 Debian GNU/Linux 10 (buster) 10 (buster)
    CPU: (8) x64 Intel(R) Core(TM) i7-8650U CPU @ 1.90GHz
  Binaries:
    Node: 12.9.0 - /usr/local/bin/node
    Yarn: 1.19.1 - /usr/bin/yarn
    npm: 6.12.0 - /usr/local/bin/npm
  Browsers:
    Chrome: Not Found
    Firefox: Not Found
  npmGlobalPackages:
    @vue/cli: Not Found

[sodatea]

@AuspeXeu

1. If you are experiencing this error with vue serve, I've no idea how this happened because this bug should not exist in either 3.12.1 or the latest 4.0.5
2. If it's yarn serve or npm run serve, then it's because eslint is not added to your project (I don't see it in the listed devDependencies fields above). That's also weird because any new project scaffolded with Vue CLI 3.1.0 (which was released a year ago) or later should have eslint in devDependencies. And if you follow the migration guide to upgrade the project to v4, eslint should also have been added.

[AuspeXeu]

I'll go thru the migration guide once again and double check everything is in place, thanks for the recommendation!

[Agboweroh]

I had same problem but solved it by simply running yarn install or npm install. I hope someone out there will find this helpful.

[100rabhcsmc]

Just do npm install eslint inside the project. It should work.

thanks, it works.

[GOLD106]

✖ 1 problem (1 error, 0 warnings)
1 error and 0 warnings potentially fixable with the --fix option.

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 in [eslint]
D:\WORKING\VUE_\Martin\terity-admin-app\src\components\AppFooter.vue
4:25 error Replace ⏎········>&copy;·{{·new·Date().getFullYear()·}}·Company</span⏎······ with >&copy;·{{·new·Date().getFullYear()·}}·Company</span prettier/prettier

When I run my source code, I can see this bug.
So I can't run my code.
Please help me if you know solution.
Thanks