vite项目中使用@代表根路径

news2024/10/6 10:34:55

1.配置vite.config.ts

import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
import path from 'path'

export default defineConfig({
  plugins: [vue()],
  resolve: {
    alias:{
      '@':  path.resolve(__dirname, 'src') }
  }
})

2.报错path和__dirname

找不到模块“path”或其相应的类型声明。

找不到名称“__dirname”

npm i path -D
npm install --save-dev @types/node

3.vue文件中引入文件报错Cannot find module '@/api/index' or its corresponding type declarations.

import { chunk } from "@/api/index"

解决:在 tsconfig.json的compilerOptions下 加上  baseUrl 和 paths 即可。

 

 

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/846951.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

K8S系列文章 之 编写自动化部署K8S脚本

介绍 通过ansible脚本shell实现自动化部署k8s基础集群(v1.25.0) 部署结构 1. 通过二进制部署包镜像安装k8s集群、目录etcd节点只支持1-3个节点、最多三个etcd节点 2. 因k8s版本相对较新、需要升级内核来支持后台程序、当前版本只支持Cento7,内核版本(5.19.4-1.el7…

本地构建包含java和maven的镜像

目录 1.前提条件 2.下载 2.1.创建Dockerfile 3.构建镜像 参考文章 1.前提条件 本地环境需要的系统和软件 win10 Docker Desktop Powershell 图1 Win10安装Docker后,直接在Powershell使用Docker命令 有些Developer不习惯win10系统,却想要使用Lin…

使用ResponseBodyAdvice封装统一返回值

目录 ResponseBodyAdvice 接口概述 ResponseBodyAdvice 快速使用 父pom文件 pom文件 ResponseDto MyResponseBodyAdvice DemoController 结果展示 ResponseBodyAdvice 接口概述 在实际项目中,我们经常需要在请求前后进行一些操作,比如&#xf…

Cesium 实战教程 - 三种方式(CZML、nodeTransformations)修改模型节点组件属性(比例、旋转、移动等)

Cesium 实战教程 - 三种方式(CZML、nodeTransformations)修改模型节点组件属性(比例、旋转、移动等) 核心代码完整代码在线示例 关于 Cesium 设置模型组件的动作,之前是通过 CZML articulations 来实现的,…

xAI与GPT-4:探索宇宙真实本质的AI之战

xAI与GPT-4:AI之战 写在前面第一部分推动科学研究提升人机交互引发伦理和社会问题 第二部分模型的进一步优化跨领域合作人机融合 反AI斗士 马斯克进军AI中国的AI产业怎么样AI这把火,还能怎么烧?最后总结 北京时间7月13日凌晨,马斯…

加速手机充电,打开这个小技巧,让充电速度翻倍,快速充满电量

加速手机充电,打开这个小技巧,让充电速度翻倍,快速充满电量 通过打开这个小技巧,我们可以在有限的时间内快速充满手机电量,解决了电量不足的困扰。不再需要长时间等待充电,让我们能够更加便捷地使用手机&a…

微服务监控技术skywalking的部署与使用(亲测无坑)

微服务监控技术skywalking的部署与使用 1. 前期准备2. skywalking安装部署2.1 Java Agent2.2 apache/skywalking-oap-server2.3 apache/skywalking-ui 3. 项目启动4.效果展示 1. 前期准备 注:本篇文章采用docker部署,采用8.2.0版本,版本一定…

vue+Highcharts绘制3D饼图

效果图 一、下载highcharts插件 npm install highcharts 二、main.js全局配置插件 import Highcharts from "highcharts/highcharts"; import highcharts3d from "highcharts/highcharts-3d"; highcharts3d(Highcharts); 三、封装highcharts.vue组件 …

FreeFileSync 12.5 正式发布,文件夹比较与同步软件

导读FreeFileSync 是一款开源软件,适用于 Windows、macOS 和 Linux。FreeFileSync 本质是一个用于文件夹对比和同步的软件,它可以创建和管理所有重要文件的备份副本。FreeFileSync 不是每次都复制每个文件,而是确定源文件夹和目标文件夹之间的…

vue-baidu-map-3x 使用记录

在 Vue3 TypeScript 项目中,为了采用 标签组件 的方式,使用百度地图组件,冲浪发现了一个开源库 ovo,很方便!喜欢的朋友记得帮 原作者 点下 star ~ vue-baidu-map-3xbaidu-map的vue3/vue2版本(支持v2.0、v…

海外ASO优化之如何给应用选择正确的类别

将我们的应用程序放在Apple App Store和Google Play正确的类别中,不仅对按类别浏览应用的用户有帮助,而且能够帮助我们的应用程序获得良好排名。 1、应用程序属于多个类别的解决方案。 需要选择最能描述我们应用程序的类别,检查一下每个类别…

.net几行代码音乐API各排行榜 热搜 入库

对比了几家大厂的音乐API的接口 这家相对规范些 现在开始从零开始 net6敏捷开发对接 入库吧 关键技术工具和思维 1 json 生成类 2 分析类 规划表设计3 sqlsuger codefirst 生成表 4 封装get post 连接5 类映射automapper6 sqlsuger 插入数据 1 json 生成类 宇宙 第 一的…

轻量级低代码平台,快速生成应用程序及不同类型的CRM系统

私有化部署的低代码快速开发平台 无需代码或通过少量代码就可以快速生成应用程序的开发平台。 这套低代码管理后台平台可以支持多种企业应用场景,包括但不限于 OA系统、 CRM系统、 ERP系统、项目管理系统、进销存系统等。无论是懂技术的开发人员还是不懂技术的业务…

多通道振弦数据记录仪应用于桥梁监测

随着城市化进程的加快,城市桥梁的数量不断增加。对于城市交通的保障作用,桥梁的重要性不言而喻。而为了保障桥梁的安全,桥梁监测的重要性也越来越受到人们的重视。在桥梁监测中,多通道振弦数据记录仪的应用得到了广泛的认可和应用…

算法通关村第五关——n数之和问题解析

1. 两数之和问题 力扣第1题就是两数之和问题,给定一个整数数组 nums 和一个整数目标值 target,请你在该数组中找出 和为目标值 target 的那两个整数,并返回它们的数组下标。你可以假设每种输入只会对应一个答案。但是,数组中同一…

聚观早报|美团创始人王慧文退出;马斯克将直播与扎克伯格笼斗

【聚观365】8月8日消息 美团创始人王慧文退出马斯克将在X上直播与扎克伯格笼斗蚂蚁微尘故事余承东微博透露鸿蒙4新进展华为出资15亿成立地产公司 美团创始人王慧文退出 据国家企业信用信息公示系统显示,北京光年之外科技有限公司在近期完成工商变更,创…

Hadoop理论及实践-HDFS读写数据流程(参考Hadoop官网)

NameNode与DataNode回顾 主节点和副本节点通常指的是Hadoop分布式文件系统(HDFS)中的NameNode和DataNode。 NameNode(主节点):NameNode是Hadoop集群中的一个核心组件,它负责管理文件系统的命名空间和元数据…

uni——不规则tab切换(skew)

案例展示 案例代码 <!-- 切换栏 --> <view class"tabBoxs"><view class"tabBox"><block v-for"(item,index) in tabList" :key"index"><view class"tabItem":class"current item.id&…

Vue 本地应用 记事本 v-on v-model v-for使用

vue当中如何生成列表结构&#xff1f;使用的指令是v-for&#xff0c;同时要有一个可以生成列表的数据&#xff0c;常用的是数组。记事本里面的内容并不复杂&#xff0c;所以这里使用字符串数组就行了。 获取用户输入的内容使用绑定v-model&#xff0c;双向数据绑定&#xff08…

黑马头条项目学习--Day1: 环境搭建、SpringCloud微服务(注册发现、网关)

Nacos注册发现、网关 a. 项目介绍b. app登录1) 需求分析2) 表结构分析3) 手动加密&#xff08;md5随机字符串&#xff09;4) 用户端微服务搭建5) 功能实现6) app网关7) 网关校验jwt8) 前端集成, 配置nginx a. 项目介绍 业务说明 技术栈说明 [外链图片转存失败,源站可能有防盗…