Vue3+Ts+vite设置别名@ 使用import引入文件默认是“./……”上下层级多一些的时候难免就会出错,设置一个基础目录的别名就比较有用了。 在vite.config.ts中添加配置 // vite.config.ts// 导入path模块importpathfrom'path'// defineConfig添加以下内容resolve:{alias:{'@':path.resolve(__dirname,'src')}}//...
vue3 配置 @ 路径别名 教程基于 vite 和 vue3-ts 前往tsconfig.json 修改compilerOptions 选项,如果没有以下参数就自己添加: { "compilerOptions": { "baseUrl": "./src", "paths": { "@/*": [ "src/*" ] } } } 然后在 vite.config.ts 里添加 resolve,如下: 做完这步之后下面还有最后一步,...
// vite.config.tsimport{ defineConfig }from'vite';import{ resolve }from'path';exportdefaultdefineConfig({resolve: {alias: {'/@/':resolve(__dirname,'./src'), }, }, }); 要解决这个问题,可以使用 Node.js 的 import.meta.url 属性来获取当前文件的路径。然后,利用 fileURLToPath() 方法将 i...
vite.config.ts 文件中配置 resolve:{alias:{'@':fileURLToPath(newURL('./src', import.meta.url)),},}, image tsconfig.json 文件中配置 //配置 @"baseUrl":".","paths":{"@/*":["src/*"]} image 然后就可以在项目中使用@了 image...
在Vue 3项目中配置路径别名,可以简化模块引用路径,提高代码的可读性和可维护性。以下是基于不同构建工具(如vue-cli和Vite)配置路径别名的详细步骤: 一、使用vue-cli构建Vue 3项目 安装依赖: 通常vue-cli创建的项目已经包含了所有必要的依赖,无需额外安装。 找到并打开配置文件: 在项目根目录下找到并打开vue.co...
首先在 vite.config.ts 种配置 然后在 tsconfig.json配置 发布于 2023-09-15 15:23・IP 属地四川 Vue.js Vue.js 3 别名 打开知乎App 在「我的页」右上角打开扫一扫 其他扫码方式:微信 下载知乎App 开通机构号 无障碍模式 验证码登录 密码登录
配置路径别名@ 1、安装@types/node npm install @types/node --save-dev 1. 2、修改vite.config.ts配置路径别名@ import { defineConfig } from 'vite' import vue from '@vitejs/plugin-vue' import path from "path";//这个path用到了上面安装的@types/node ...
【Vue】vite + ts 配置别名 import { defineConfig } from 'vite' import vue from '@vitejs/plugin-vue' import {resolve} from 'path' function _resolve(dir: string) { return resolve(__dirname, dir) } // https://vitejs.dev/config/
vite中路径别名设置 注意配置项下的resolve下的alias就是进行相应的设置。 // vite.config.tsimport type{UserConfig,ConfigEnv}from'vite';import{loadEnv}from'vite';import pathfrom'path';exportdefault({command,mode}:ConfigEnv):UserConfig=>{constroot=process.cwd();constenv=loadEnv(mode,root);// The...