Module is not installed?

Question

JavaScript

Exactly the same trouble for PhpStorm 2019.1.2
https://intellij-support.jetbrains.com/hc/en-us/co...
Importing the module works correctly, but the storm issues a warning.
Clearing the cache didn't help.

import * as test from '@store/getters'; // warning not installed

module.exports = {
    mode: 'development',
    entry: [
        './src/app.js',
    ],
    output: {
        path: path.resolve(__dirname, '../dist'),
        filename: 'main.js',
        publicPath: '/',
    },
resolve: {
        extensions: ['.js', '.vue', '.json'],
        alias: {
            vue: 'vue/dist/vue.js',
            config: path.resolve(__dirname, '../config'),
            src: path.resolve(__dirname, '../src'),
            '@store': path.resolve(__dirname, '../src/store'),
            assets: path.resolve(__dirname, '../src/assets'),
            components: path.resolve(__dirname, '../src/components'),
            '@': path.resolve(__dirname, '../src'),
...

node -v = 10.1
Plugin Node,js, Vue.js stand.
How then to properly configure storm or webpack?
UPD

Elena Pogorelova
Created October 03, 2017 04:48 PM
make sure to specify a path to your webpack config in Settings | Languages ​​& Frameworks | JavaScript | webpack. See https://intellij-support.jetbrains.com/hc/en-us/co...
Note also that you have to include file extension in import - https://intellij-support.jetbrains.com/hc/en -us/co...

In my case, specifying the config helped.
It was only then that all the paths for node_modules broke. That is, any import from node_modules now began to issue a warning!

import {mapGetters, mapActions} from 'vuex';

    export default {
        name: 'test',
        computed: {
            ...mapGetters({

Cannot resolve symbol mapGetters
Cannot resolve symbol mapActions
https://vuex.vuejs.org/guide/getters.html#the-mapg...

export declare const mapGetters: Mapper<Computed>
  & MapperWithNamespace<Computed>;

export declare const mapActions: Mapper<ActionMethod>
  & MapperWithNamespace<ActionMethod>
  & FunctionMapper<Dispatch, ActionMethod>
  & FunctionMapperWithNamespace<Dispatch, ActionMethod>;

https://github.com/vuejs/vuex/blob/caa663d69608fc3...
So there is no warning

import {mapGetters, mapActions} from 'vuex/types/helpers';

But there is a mistake

Module not found: Error: Can't resolve 'vuex/types/helpers'

It is worth noting that if you remove the path to the webpack config, there is no warning for import {mapGetters, mapActions}but there is for webpack aliases.

Answer 1

You have a completely wild section of aliases.
for example

'@': path.resolve(__dirname, '../src'),
'@store': path.resolve(__dirname, '../src/store'),

Doesn't the second alias seem redundant?

import some from '@/store/some';
import some from '@store/some';

Not a big difference.
Everything else from the same series.
Just a couple of rules, and they are enough. Especially in the phpStorm environment, which itself sticks these imports, eliminating the need to write with pens.
In order for imports to resolve correctly, you need to specify the path to the webpack config.
And enable the option "Use path aliases" in the code-style settings.
PS. I see you are configuring webpack yourself. Try vue/cli 3. You quickly get a ready-made config out of the box. You can save your presets. Well, of course, you can manually add configs.