vue.config.js配置-路径别名

1. 在根目录下创建vue.config.js文件
2. 修改vue.config.js

module.exports = {
  configureWebpack: {
    devServer: {
     // 设置端口
      port: 3001,
      // 自动打开
      open: true
    },
    resolve: {
      alias: {
      //这里配置了components文件的路径别名
        '@': resolve('src'),
      'components': resolve('src/components'),
      'pages': resolve('src/pages'),
      'api': resolve('src/api'),
      'stylus': resolve('src/stylus'),
      'common': resolve('src/common'),
      }
    }
  }
}

configuerWebpack是vue-cli中提供的简单配置方式,设置好后该对象会被合并到最终的webpack中 官网链接

3. 配置完记得重新serve,配置才能生效~