如何在webpack项目中添加文件夹映射绝对路径

要求（针对的情况）

在webpack项目中有很多的引入是需要加一个特定的前缀的那么怎么映射文件位置呢
例如我需要把

import { xxx } from "src/components/bar/slideBar.vue'

改成更为简单的

import { xxx } from "@bar/slideBar.vue'

需要怎么做呢？

解决办法

此处的配置文件在根目录的下面一层
src文件夹在根目录
webpack配置文件中加入

var path = require('path');
...
function resolve (dir) {
	return path.join(__dirname, '..', dir);
}
...
module.exports = {
	//...
	resolve: {
		extensions:  ['.js', '.vue', 'json'],
		alias: {
			'@bar': resolve('src/components/bar')
		}
	}
}

意为检测.js 后缀 .vue后缀 .json后缀的文件 并且替换前面的路径