nuxt-storm

NuxtJS module for WebStorm and PhpStorm that assists with using @nuxt/components

Quick Setup

1. Add nuxt-storm to your project as a development dependency

# Using yarn
yarn add --dev nuxt-storm
# Using npm
npm install --save-dev nuxt-storm

2. Add .components.gen.js to your .gitignore file

3. Add 'nuxt-storm' to the buildModules section of nuxt.config.js

{
  buildModules: [
    'nuxt-storm',
  ]
}

ℹ️ If you are using nuxt < 2.9.0, use modules property instead.

That's it! Restart your yarn dev and components should now be found ✨

Nested Components Support

Add nested: true in your buildModule inclusion

{
  buildModules: [
    ['nuxt-storm', { nested: true }],
  ]
}

If you have components in nested directories:

| components/
---| My/
------| Form/
---------| TextArea.vue

The component name will contain its path:

<MyFormTextArea />

Path alias

Should your IDE fail to recognize vue component by its absolute path, you can replace it with path alias (default '@').

Thus, the aforementioned component path will be listed as @/components/My/Form/TextArea.vue instead of C:/some/absolute/path/project/components/My/Form/TextArea.vue.

Add alias: true in your buildModule inclusion or set a custom alias as its value should you use one.

{
  buildModules: [
    ['nuxt-storm', { alias: true }],
  ]
}

🙏 Thanks

This was made possible by with the help of grunghi and eggsy