webstorm에서 webpack을 사용하지 않는다면 ide에서 alias 인식을 못한다. 타입스크립트라면 따로 설정을 할 수 있지만 일반적인 자바스크립트라면 방법이 없다.
하지만 webstorm은 webpack.config.js파일을 기본적으로 확인해본다.

그래서 다음과 같이 webpack.config.js파일을 만들어서 넣어두면 alias 설정한대로 인식한다.
주로 nuxt 프레임워크에서 쓸모 있을것이다. (기본적으로 alias가 설정 되어있기 때문에..)

const path = require('path')

// for webstorm
module.exports = {
  resolve: {
    alias: {
      '~': path.resolve(__dirname),
      '@': path.resolve(__dirname),
    }
  }
}