vue项目开发时一般用相对路径，但是如果文件位置发生变动，需要重新设置路径，为了解决这个问题，直接通过修改vue-cli的webpack配置，进行别名的设置
参考官方文档
- vue-cli官方文档webpack相关
- image.png
实现方案
- 新建vue.config.js文件
// vue.config.js
const path = require('path')
module.exports = {
configureWebpack: config => {
if (process.env.NODE_ENV === 'production') {
// 为生产环境修改配置...
} else {
// 为开发环境修改配置...
return {
resolve: {
alias: {
'@js': path.resolve(__dirname, './src/assets/js'),
'@css': path.resolve(__dirname, './src/assets/css'),
'@img': path.resolve(__dirname, './src/assets/imgs'),
'@c': path.resolve(__dirname, './src/components'),
}
}
}
}
}
}
- 用别名替换相对路径
// old
import './assets/js/htmlFontSize';
// new
import '@js/htmlFontSize.js';
