How to import linting rules from eslint-plugin-vue Follow
I am currently using eslint-plugin-vue for linting of Vue application. But there is no set of JSON rules configuration file which I can import in WebStorm.
Due to this, WebStorm is giving different warnings from what been defined in eslint-plugin-vue:strongely-recommended. So, is there any way I can update settings present in WebStorm for linting to get all rules from this specific plugin?
Please sign in to leave a comment.
Not sure I follow you... There are no WebStorm settings for this - it just reads your eslint configs (actually, it just runs eslint that does this). You can override the rules coming from extended configurations in your .eslintrc
My .eslintrc contains those rules. But WebStorm is not understanding these rules and showing no error as specified by rules. Any way I can add these rules too?
Please provide your .eslintrc, package.json and screenshot of ESLint preferences page
I have created the config from --print-config command of eslint. You can see various rules specific to vue having 'vue-' initials
what is "../../.eslintrc.js"? Is it a part of your project? Also, please provide the other infor I asked for - your package.json and screenshot of ESLint preferences page
I have the same issue with vue linting. I used different IDE for the same project based on vue-cli and in that IDE I see an eslint-plugin-vue error which I didn't see in IntelliJ or WebStorm. So, how I can configure linting for vue in WebStorm if it's possible?
But in different IDE:
What IDEA version do you work with? Can you share your eslint configuration and package.json (or, better, a test project that shows up the issue)?
Same problem for me.
If you believe that your issue is the same, please can you provide the requested info? Eslint configuration and package.json (or, better, a simple test project that shows up the issue)?
Sorry for the long answer. So, I create a repo on GitHub with the project.
I've tried some different configurations from this and this, but linter just doesn't work as I expect.
What exactly I expect? – This. As you can see, there is an error. on <li v-for="link in links">.
So, the question is, am I doing something wrong with configuring .eslint or WebStorm now can't linting with this plugin?
Build #WS-173.3942.31, built on December 12, 2017
Licensed to Arthur Kuz
Subscription is active until May 17, 2018
JRE: 1.8.0_152-release-1024-b8 x86_64
JVM: OpenJDK 64-Bit Server VM by JetBrains s.r.o
Mac OS X 10.12.6
linting doesn't seem to work for your configuration when running `npm lint` as well... i had to change your .eslintrc.js as follows to make it work:
still, integration doesn't work using this config. Logged as https://youtrack.jetbrains.com/issue/WEB-30394, please follow it for updates
Same here. When could it be addressed?
seems to be fixed in trunk - see https://youtrack.jetbrains.com/issue/WEB-30394
Unfortunately, it doesn't.
This is my `.eslintrc.js` https://pastebin.com/tBMsbz0k
These are settings for PhpStorm: https://monosnap.com/file/uKHQeY4fkVpgPmRMyVzaprehUDq5QM
`package.json`: (some info is stripped out) https://pastebin.com/8UYvwcEg
Eslint itself works fine: https://monosnap.com/file/97gF56XyKNzm51s3PBXNd9lmgvc2TV
I run it as `node_modules/.bin/eslint --fix --ext .js,.vue resources/assets/js`
what build do you use? i don't think you can access PhpStorm daily builds, can you? 'fixed in trunk' doesn't mean 'fixed in latest release'
Build #PS-173.4127.29, built on December 22, 2017
was this fixed in EAP?
Sorry for multiposting, could you please post a link to the release notes?
No, the fix is not included in any EAP
@Elena Pogorelova when we can expect this to be fixed as the issue is known and many users are facing it gradually?
Fix can be expected in 2018.1
Cool! Do you already know the release date with this fix?
2018.1 is planned for March
2018.1 has been released but vue-eslint-parser rules still don't work in phpstorm
works for me in 2018.1.1:
please share a sample project that can be used to recreate the issue
Could you provide a simple working example of package.json with eslint-plugin-vue?
@Will Default project generated with Vue cli? Can be created via New > Project.. > Vue.js
I investigated this problem a bit . I have a big project with many package.json files. And one of sub-projects is a Vue.js project.
This subdir contains .eslintrc.js with root:true and eslint-plugin-vue installed, but WebStorm still trying to find this eslint-plugin-vue in the very root of my project.
Not in the directory with .eslintrc.js with root:true.
Error: Failed to load plugin 'vue' declared in 'automerge/new-frontend/.eslintrc.js': Cannot find module 'eslint-plugin-vue'
Referenced from: /home/alexey/projects/work/automation/automerge/new-frontend/.eslintrc.js
But running eslint from /home/alexey/projects/work/automation/automerge/new-frontend works correctly.
According to such path 'automerge/new-frontend/.eslintrc.js' i suppose that WebStorm incorrectly sets CWD for eslint.
For VS Code the issue is solved by