Vue 3 项目中使用 '@' 作为根路径别名

在 Vue 3 项目中，你可以使用 ‘@’ 符号作为根路径别名来引用模块文件。要配置这个别名，你需要修改项目的 ‘vue.config.js’ 文件。

以下是一个示例的 ‘vue.config.js’ 文件的配置：

const path = require('path');

module.exports = {
  chainWebpack: (config) => {
    config.resolve.alias.set('@', path.resolve(__dirname, 'src'));
  },
};

在这个配置中，‘chainWebpack’ 方法用于修改 Webpack 配置，通过 ‘resolve.alias’ 配置项将 ‘@’ 别名指向了 ‘src’ 目录。

请确保你已经安装了 ‘path’ 模块，可以在配置文件的开头使用 const path = require('path'); 来引入。

完成这个配置后，你就可以在 Vue 3 项目中使用 ‘@’ 符号作为根路径的别名了，例如 import HelloWorld from '@/components/HelloWorld.vue';。

在修改完配置文件后，可能需要重新启动开发服务器以使配置生效。

希望这能帮助到你！如果有更多问题，请随时提问。