简介:本文介绍了如何在Vue 3的Vite配置文件`vite.config.js`中设置路径别名,以及如何在页面中使用这些别名导入模块。 在vite.config.js中配置 import{ defineConfig }from'vite'importvuefrom'@vitejs/plugin-vue'constpath =require('path')exportdefaultdefineConfig({resolve: {alias: {"@": path.resolve(__d...
使用vite开发vue3项目时,如果想要配置路径别名,可以通过下面的几个步骤进行配置。 首先,因为开发环境是ts,并且还要使用到node中的path模块,所以需要先安装一下node的类型声明文件。 npm i -D @types/node 安装完成后,就可以在vue.config.ts中增加如下的配置。 import{ defineConfig }from'vite' importvuefrom'@vi...
Vite+Vue3设置路径别名 // 1.vite.config.js文件添加importpathfrom'path'// 如果引入的时候报错则需要 npm install --save-dev @types/noderesolve: {alias: {'@': path.resolve(__dirname,'src') } },// 2. tsconfig.node.json 文件添加 设置导入规则{"compilerOptions": { ..."allowSyntheticDefault...
3. 修改vite.config.js配置文件 import{defineConfig}from'vite'importvuefrom'@vitejs/plugin-vue'importpathfrom'path'// https://vite.dev/config/exportdefaultdefineConfig({plugins:[vue()],resolve:{alias:{'@':path.resolve(__dirname,'./src')// 配置`@`指向src目录}},css:{preprocessorOptions:{s...
这里将vue添加进去// 配置文件别名 vite1.0是/@/ 2.0改为/@// 这里是将src目录配置别名为 /@ 方便在项目中导入src目录下的文件resolve:{alias:{"/@":pathResolve("src"),"/config":pathResolve("public/config"),"/com":pathResolve("src/components")}},base:"vue3-blog",// 便于发布到gitee// ...
vue3+ts+vite 相对路径别名配置@ 首先在 vite.config.ts 种配置 然后在 tsconfig.json配置
使用import引入文件默认是“./……”上下层级多一些的时候难免就会出错,设置一个基础目录的别名就比较有用了。 在vite.config.ts中添加配置 // vite.config.ts// 导入path模块importpathfrom'path'// defineConfig添加以下内容resolve:{alias:{'@':path.resolve(__dirname,'src')}}// 例如import{defineConfig...
"Vite":"3.0.0""Vue":"3.2.37""Ts":"4.6.4" AI代码助手复制代码 出现问题: 在配置完Vite后,正常开发没问题,但是Ts类型检查报错: 找不到模块"/xxx/xxx/xxx"或其相应的类型声明 2. 解决方法 首先要配置Vite,根据官方文档中的给出的类型说明: ...
Vue3 - Vite项目别名src to @ not working是关于Vue3和Vite项目中别名配置不起作用的问题。以下是对这个问题的完善且全面的答案: 问题描述:在Vue3和Vite项目中,当尝试使用别名配置将"src"目录路径替换为"@"时,别名配置不起作用。 解决方案: 确认项目配置: 确保已经正确安装了Vue3和Vite,并创建了...