2、修改vite.config.ts配置路径别名@ import { defineConfig } from 'vite' import vue from '@vitejs/plugin-vue' import path from "path";//这个path用到了上面安装的@types/node // https://vitejs.dev/config/ export default defineConfig({ plugins: [vue()], //这里进行配置别名 resolve: { al...
"allowSyntheticDefaultImports": true, // 允许对不包含默认导出的模块使用默认导入。 "baseUrl": ".", // 非相对模块的导入可以相对于baseUrl或通过下文会讲到的路径映射来进行解析 "lib": [ "esnext", "dom" ], "paths": { // 配置导出路径(这里根据自己项目执行修改) "@/components*": [ "./src...
路径别名是为了方便模块文件引入,比如有src/util/time_util.ts这样一个模块。如果没有路径别名,可能有的是import time_util from './time_util',有的是import time_util from '../../../../../time_util'这样引入。而有了路径别名,不管当前模块文件在哪个路径,都可以统一用import time_util from '@/uti...
使用vite开发vue3项目时,如果想要配置路径别名,可以通过下面的几个步骤进行配置。 首先,因为开发环境是ts,并且还要使用到node中的path模块,所以需要先安装一下node的类型声明文件。 npm i -D @types/node 安装完成后,就可以在vue.config.ts中增加如下的配置。 import{ defineConfig }from'vite' importvuefrom'@vi...
ts部分,网上都说在tsconfig.json文件中配置,但是想要正常使用路径别名,配置必须放在tsconfig.app.json文件里面 ——— 使用vite创建基于vue+ts模板生成的项目文件,根目录下会存在tsconfig.json、tsconfig.app.json、tsconfig.node.json三个ts配置文件。 根据网上说法,据说在vite3以后,引进了references属性,可以根据环境...
使用import引入文件默认是“./……”上下层级多一些的时候难免就会出错,设置一个基础目录的别名就比较有用了。 在vite.config.ts中添加配置 // vite.config.ts// 导入path模块importpathfrom'path'// defineConfig添加以下内容resolve:{alias:{'@':path.resolve(__dirname,'src')}}// 例如import{defineConfig...
vite.config.ts 文件中配置 resolve:{alias:{'@':fileURLToPath(newURL('./src', import.meta.url)),},}, image tsconfig.json 文件中配置 //配置 @"baseUrl":".","paths":{"@/*":["src/*"]} image 然后就可以在项目中使用@了 image...
1.yarn create vite [创建项目]2.输入项目名[vitevue3ts]3.选择使用的js框架vue4.使用使用ts 选择vue-ts5.cd vitevue3ts6.npm install7.npm run dev 自动打开浏览器,将vite.config.ts文件配置如下 import{ defineConfig }from'vite'importvuefrom'@vitejs/plugin-vue'// https://vitejs.dev/config/expo...
vue3+ts+vite 相对路径别名配置@ 首先在 vite.config.ts 种配置 然后在 tsconfig.json配置