1.首先,需要在vscode中安装一个插件

2.在setting.json中添加以下代码:
//导入文件时是否携带文件扩展名
"path-autocomplete.extensionOnImport":true,
"path-autocomplete.pathMappings":{
"@":"${folder}/src"
},
3.此时已经有@提示了,但是vite项目依旧报错
4. 找到根目录下的vite.config.js做如下配置:(已经注释的为本来已经有的,未注释的则为你要添加的)
/* import { defineConfig } from "vite";
import AutoImport from "unplugin-auto-import/vite";
import Components from "unplugin-vue-components/vite";
import { ElementPlusResolver } from "unplugin-vue-components/resolvers";
import vue from "@vitejs/plugin-vue"; */
import path from "path";
// https://vitejs.dev/config/
export default defineConfig({
/* plugins: [
vue(),
AutoImport({
resolvers: [ElementPlusResolver()],
}),
Components({
resolvers: [ElementPlusResolver()],
}),
], */
resolve: {
alias: {
"@": path.join(__dirname, "src"),
"#": path.join(__dirname, "types"),
},
},
});
5.此时可能会报path错误,只需下载@types/node即可
npm i -D @types/node
6。最后,重启项目,你会发现@可以用了,奇怪的知识又多一个。
文章介绍了如何在VSCode中通过安装path-autocomplete插件并配置setting.json来实现文件导入时携带扩展名。然后在Vite的vite.config.js中设置alias,解决@提示但项目报错的问题。如果出现path错误,可以通过安装@types/node来解决。最后重启项目,@导入功能就能正常工作。

2436

被折叠的 条评论
为什么被折叠?



