vue关于@无法找到文件报错

如果在Vite项目中使用@无法找到文件，通常是因为未正确配置路径别名（path alias）导致的。在Vite中，您可以使用vite.config.js文件来配置路径别名。

以下是一个示例的vite.config.js文件，展示了如何配置路径别名：

// vite.config.js
import { defineConfig } from 'vite';
import path from 'path';

export default defineConfig({
  resolve: {
    alias: {
      '@': path.resolve(__dirname, './src')
    }
  }
});

在上述示例中，我们使用alias选项来配置路径别名。通过@别名，我们将./src目录与@关联起来。

请确保将路径别名配置为与您的项目结构和实际路径相匹配。一旦配置了路径别名，您就可以在您的代码中使用@来引用文件，例如：

//配置less @ 跨域

import { defineConfig } from "vite";
import vue from "@vitejs/plugin-vue";
// 配置@
import path from 'path';
// 配置less
export default defineConfig({
  plugins: [vue()],
  resolve: {
    alias: {
      "@": path.resolve(__dirname, "./src"),
    }
  },
  css: {
    preprocessorOptions: {
      less: {
        javascriptEnabled: true,
      },
    },
  },
  // 跨域
  server: {
    proxy: {
      "/api": {
        target: "http://localhost:3000",
        changeOrigin: true,
        rewrite: (path) => path.replace(/^\/api/, ""),
      },
    },
  },
});