vite vue3 路由配置@找不到文件的问题及解决
作者：摆烂程序鱼
在Vite项目中配置路由时,可能会遇到文件路径错误导致的加载失败问题,常见的解决办法包括安装路径处理插件、正确设置vite.config.js中的路径别名以及重启项目,通过正确配置,可以确保路由正确加载对应的界面文件,避免路径错误导致的问题
问题描述
在vite.config.js文件中配置路由的时候，添加路由界面，找不到指定的文件，提示错误
如图所示：
但是换成 ./ 或者 ../ 就正常了，也没有报错问题
解决办法
1.安装一个path的插件
npm install --save-dev @types/node
2.在vite.config.js中配置
import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
import { resolve } from "path"
export default defineConfig({
plugins: [vue()],
resolve: {
alias: {
"@": resolve(__dirname, "./src")
}
}
})3.重启项目就ok啦~
总结
以上为个人经验，希望能给大家一个参考，也希望大家多多支持脚本之家。