webstorm为我们提供了 webpack.config.js来帮助我们寻找文件位置。
webpack配置文件
随着项目越来越大，新的vue-cli3出来之后，已经很少再去暴露配置了，甚至于无法解析。此时有一些项目特立独行的配置文件让我觉得可以学习一下。
配置webstorm.config.js
webpack 的alias选项
webpack配置alias.png
分析过程
- webpack.config.js 原来是帮助webstorm来优化配置的，但是webstorm无法应对千奇百怪的架构变化，
- 分析实质其实就是利用了webpack.config.js中的 module.exports语法来分析alias路径，从而帮助我们解析文件。
- 所以我们只需要写一个JS文件和webpack.config.js相似，同时也module.export相同的参数即可。
重写配置（有的项目叫做webstorm.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'),
'@comp': resolve('src/components'),
'@core': resolve('src/core'),
'@utils': resolve('src/utils')
}
},
}
