VUE - 配置根目录（用@代表src目录）

VUE - 配置根目录（用@代表src目录）

在 Vue 项目中，@ 符号通常被用作一个别名，代表项目中的 src 目录。这通常是通过 webpack 的 resolve.alias 配置实现的。

例如，如果你有一个 Vue 组件在 src/components 目录下，你可以在这个组件中这样导入它：

import MyComponent from '@/components/MyComponent.vue';
import MyComponent from '../components/MyComponent.vue';

 

这是因为 webpack 配置了一个别名 @ 指向 src 目录。

如果你使用 Vue CLI 创建的项目，这个配置默认已经为你设置好了。如果你需要自己设置，可以在 vue.config.js 文件中添加如下配置：

const path = require("path");

module.exports = {
  configureWebpack: {
    resolve: {
      alias: {
        '@': path.resolve(__dirname, 'src')
      }
    }
  }
}

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

引用：https://www.jb51.net/article/254828.htm