526互联

vuejs3.0 从入门到精通——Vite解决@问题

发布时间 2023-11-02 10:57:16作者: 左扬

Vite 解决 @ 问题

  在Vue3和Vite中，@符号通常用于别名，指向src目录。这是Vue CLI项目的默认设置，但在Vite项目中，你需要手动配置这个别名。

  在Vite中，你可以在vite.config.js文件中配置别名。这是一个配置示例：

import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
import path from 'path'

// https://vitejs.dev/config/
export default defineConfig({
  plugins: [vue()],
  resolve: {
    //配置路径别名
    alias: {
      '@': path.resolve(__dirname, './src')
    },
  },
});

  在这个配置中，@别名被设置为指向src目录。这意味着你可以在项目中像这样使用@：

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

  这个配置应该放在你的项目根目录下的vite.config.js文件中。如果你没有这个文件，你可以创建一个。在配置文件中使用正确的路径，以确保你的别名设置正确。