WebStorm 如何识别 Webpack 中的别名

例如：在webpack.base.config.js 文件中的别名配置

'use strict'
const path = require('path')

function resolve (dir) {
  return path.join(__dirname, '.', dir)
}

module.exports = {
    context: path.resolve(__dirname, './'),
    resolve: {
        extensions: ['.js', '.vue', '.json'],
        alias: {
            '@': resolve('src'),
            '@views': resolve('src/views'),
            '@components': resolve('src/components'),
            '@core': resolve('src/core'),
            '@utils': resolve('src/utils')
        }
    },
}

WebStorm Windows setting：
File > Settings > Languages and Frameworks >JavaScript | Webpack

WebStorm MacOS setting：

WebStorm | Preferences | Languages and Frameworks | JavaScript | Webpack

配置如下图：