我们先看看 vite.config.js里面的常用配置,其他配置可以看官网:https://cn.vitejs.dev/config/ 代码语言:javascript 复制 // vite.config.jsimport{defineConfig}from'vite'importvuefrom'@vitejs/plugin-vue'import{resolve}from"path"// 主要用于alias文件路径别名// 加别名的函数functionpathResolve(dir){return...
使用vite开发vue3项目时,如果想要配置路径别名,可以通过下面的几个步骤进行配置。 首先,因为开发环境是ts,并且还要使用到node中的path模块,所以需要先安装一下node的类型声明文件。 npm i -D @types/node 安装完成后,就可以在vue.config.ts中增加如下的配置。 import{ defineConfig }from'vite' importvuefrom'@vi...
在vite.config.js中配置 import{ defineConfig }from'vite'importvuefrom'@vitejs/plugin-vue'constpath =require('path')exportdefaultdefineConfig({resolve: {alias: {"@": path.resolve(__dirname,"./src/assets/js"), }, } }) 页面使用 importaxiosfrom'@/axios' 坑:引用.vue文件的时候记得写全后缀。
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...
1. 项目安装Sass依赖包 2. 项目安装Path依赖包 3. 修改vite.config.js配置文件 additionalData处配置项目默认的全局Sass样式文件...
在vite.config.ts中添加配置 // vite.config.ts// 导入path模块importpathfrom'path'// defineConfig添加以下内容resolve:{alias:{'@':path.resolve(__dirname,'src')}}// 例如import{defineConfig}from'vite'importvuefrom'@vitejs/plugin-vue'importpathfrom'path'// https://vitejs.dev/config/exportdefau...
vite.config.ts 文件中配置 resolve:{alias:{'@':fileURLToPath(newURL('./src', import.meta.url)),},}, image tsconfig.json 文件中配置 //配置 @"baseUrl":".","paths":{"@/*":["src/*"]} image 然后就可以在项目中使用@了 image...
vue3+ts+vite 相对路径别名配置@ 首先在 vite.config.ts 种配置 然后在 tsconfig.json配置
常见配置选项 plugins: 插件配置。使用Vue时,需要引入@vitejs/plugin-vue插件。 server: 开发服务器配置。 port: 设置开发服务器端口。 open: 启动开发服务器时自动打开浏览器。 resolve: 模块解析配置。 alias: 路径别名配置,例如将@映射到/src目录。