WebStorm Vue Unresolved variable or type - vue.js

I have upgraded my WebStorm to version 2019.2.1 yesterday.
After that I have some issues with Vuex methods:
Methods and computed added locally works fine and are recognized by WebStorm (green arrows)
But getters and actions are not: Unresolved variable or type... (blue and red arrows)
This is misleading + I can't use shortcut to jump to method.
How can I make it work?
UPDATE
Adding this. before like: changing canBeEdited to this.canBeEdited solves the error but it seems to be a hack (not very comfortable though)

Submitted to developers as WEB-40929, please follow it for updates

Related

error related with v-slot in my IDE, or some other issue

I am working in vue.js and placed this syntax all over the place, everything works as expected, but I cannot get rid of this error all over the place (Unrecognized slot name).
I've read in several places that maany people have the same issue but I haven't found an answer.
Do you know a work around?
Seems to be an unresolved issue with WebStorm IDE. For what it's worth, I've not seen this problem when using Visual Studio Code.

Hyperapp code intellisence in WebStorm

Is there a plugin for Hyperapp support in WebStorm or a way to set up intellisense to not flash with errors?
Currently, the editor sees components as React components, which is close but not ideal.
Update:
Similar to Preact, Hyperapp uses e.g. class instead of className.
Screenshot with JS version set to ES6:
Screenshot with JS version set to React JSX:
To disable the warning about the class attribute, place the caret on it, press Alt-Enter and select Add 'class' to custom attributes.
My solution (albeit unplanned) at the end was to switch from javascript to typescript. By converting the solution to typescript error disappeared from IDE.
Hyperapp has support for typing so that works nicely with TSLINT and intellisense.
Important compiler option parameters to make it work:
"jsx": "react",
"jsxFactory": "h",

Vue-Material navbar, Missing required prop: "to"

So the Vue-Material docs (https://vuematerial.io/components/bottom-bar) says it is possible to create a md-bottom-bar stuffed with md-bottom-bar-item, while being able to make md-bottom-bar-item act like a <router-link>
Their code can be seen right below "Seamless integration with Vue Router" (this is exactly what it's meant for by the way ^^), and my code looks like this :
<md-bottom-bar-item
id="messageRoute"
to="/Messages"
#click="stuff"
md-label="Notifications"
md-icon="message">
</md-bottom-bar-item>
<md-bottom-bar-item
id="settingsRoute"
to="/Settings"
#click="stuff"
md-label="Options"
md-icon="settings">
</md-bottom-bar-item>
These are tabs to a notifications list, and the settings page for my app.
The error I got when I click on an item is literally this (I got it 5 times though, beucause there's 5 items in my navbar) :
[Vue warn]: Missing required prop: "to"
found in
---> <MdButton> at src/components/MdButton/MdButton.vue
<MdBottomBarItem> at src/components/MdBottomBar/MdBottomBarItem.vue
<MdRipple> at src/components/MdRipple/MdRipple.vue
<MdBottomBar> at src/components/MdBottomBar/MdBottomBar.vue
<NavBar> at src\components\NavBar.vue
<App> at src\App.vue
<Root>
I got the same error without the #click='stuff' by the way, nothing to do with it.... I guess...
Is it about Vue-Material#1.0.0 (the one I'm using) being in beta or ? It feels like I'm doing what is showed in the doc, I even copy-pasted it and changed things so it would fit in my app.
For now I just did a goTo(path) methods, that just do this.$router.replace(path), but the bottom bar is not sync with Vue's router, with the md-sync-route attribute, like so :
<md-bottom-bar md-sync-route>
<!-- stuff -->
</md-bottom-bar>
Not a critical problem, but damn, why Vue.js, why ??? ^^'
And, what a troll :
Ok, this is interesting.
As the issue you gave me pointed out, this might be a version problem, but my vue version is 2.9.2 (checked it with vue -V). Nevermind, I still ran npm update -g vue, and the answer I got from the terminal... well :
+ vue#2.5.11
updated 1 package in 0.626s
Now everything works fine (router, to, etc...).
But why though ? Does vue-material uses a slightly different vue, or there's some parts that are redefined, like router link's behavior on certain element like md-bottom-bar-item ?
And why npm install couldn't fix that ? Well anyway, now it works, and my last questions exists probably because this framework is a beta and few things have to be done... or because I'm starting to do stuff with npm etc ^^
If you know something it would be helpful for me to know, feel free to tell me, I'd be glad to hear...
It will also happen in 1.0.0-beta-8, but there seems to be a commit to fix
https://github.com/vuematerial/vue-material/commit/6860d3a004b09baef751724c0d9bf1ebdf92b752

IntelliJ IDEA does not find operators of Observable in rxjs5

I just installed rxjs 5 beta 3 via npm i rxjs#5.0.0-beta.3.
I have the following example code:
import {Observable} from "rxjs"
new Observable(o => o.next(42)).filter(() => true);
This code compiles perfectly well when using ts-node for example.
But when looking at this code inside IntelliJ IDEA, the filter() operator is not found.
When using operators on an Observable instance, they are not found either.
The suggested static members of Observable are:
create()
if()
throw()
The suggested members of an instance of Observable are:
_isScalar()
forEach()
lift()
subscribe()
I also tried to import only what I need, but still my IDE tells me that filter() does not exist on the Observable instance:
import {Observable} from "rxjs/Observable"
import "rxjs/add/operator/filter"
new Observable(o => o.next(42)).filter(() => true);
Any suggestions how to make IntelliJ IDEA know about the operators?
To fix this issue you need to add RxJS as a javascript library in IntelliJ:
Go to Settings -> Languages and frameworks -> JavaScript -> Libraries
Click Add...
Add node_modules/rxjs by clicking the + button
Click all the OK buttons until you are back in your editor.
This solution is tested to work on IDEA 2016.1.3
Please, check IDEA 2016.1.2 or higher
Note: Directory node_modules must be not excluded from the project.
Otherwise, see answer https://stackoverflow.com/a/38499577/1057218
Note 2: File package.json must contain the direct dependency (or devdependency) 'rxjs'
Accepted answer doesn't work. I have tested IntelliJ IDEA 2016.2.1 EAP (ideaIU-162.1447.7) and the problem still persist.
The rabbit hole goes as follows:
In the accepted answer you find a link to version 2016.1, but that doesn't fix the problem.
Then you see a comment with a link to the IntelliJ bugtracker, where OP has the first/top comment.
At the bottom of that issue/bug thread you find a comment saying IDEA 2016.2 162.426.1 EAP will definitely fix the problem, it doesn't.
Bottom line, if you import all of what RxJS has to offer with import {Observable} from 'rxjs/Rx'; IntelliJ will still complain that it can't find methods like .map and .filter

Intellij idea deprecated no strikeout/strikethrough

I'm using IntelliJ IDEA v12. When I import a project, there’s a strikeout/strikethrough line on the method which has the annotation #Deprecated, but I used alt+enter to disable it. So, how can I reactivate this feature? I want to display that strikethrough, thanks!
Open Settings -> Type Inspections to go to inspection settings -> Type Deprecated to find out all deprecated related inspection settings -> Check Deprecated API usage.
IntelliJ had a bug in 2018.3, 2018.2.2 (182.4129.33). It was fixed in builds 191.65, 183.3691.
Setting -Dide.text.effect.new.metrics=false in the .vmoptions fixes the problem.
In addition to Ionghua's answer .....
If you find that IntelliJ is still not striking out deprecated methods, even though you have enabled the inspection as above, check to make sure that your code is not ignoring deprecation warnings with #SuppressWarnings("deprecation").
In addition to longhua's answer... and vegemite4me...
Another possible source for this problem might be custom color themes.
If you are using a custom theme, make sure that it contains strikethrough. I was using monokai-sublime and there is no strikethrough for #Deprecated annotations. When I changed the color theme from monokai to darcula strikethrough worked as expected.
I found that the only thing that worked for me with version 2019.2 192.5728.98, runtime 11.0.3+12-b304.10 was to use Help | Edit VM Options and add -Dide.text.effect.new.metrics=false