Make WebStorm to understand which vue components are registered globally
For those coming here, this is the solution:
- Install vue-docgen-web-types in your project (docs):
npm i vue-docgen-web-types
- Add the following to
package.json
"scripts": { "update-web-types": "vue-docgen-web-types" }, "web-types": "./web-types.json",
- Run the
update-web-types
npm command.
If you also want to be able to click on your custom components to navigate to the source file, then you have to do the following since there is currently a pathing bug:
This is what you currently get in the generated web-types.json
file:
"source": { "module": "./src\\components\\General\\Page.vue", "symbol": "default" }
But if you fix the pathing to:
"source": { "module": "./src/components/General/Page.vue", "symbol": "default" }
The everything works!
So just replace all "//
" with "\
" after you run the update-web-types
npm command.
Jetbrains issues: