【vue3+ts】@设置别名

news2024/12/27 13:52:04

新建的vue3+ts项目,建路由的时候报错:

在这里插入图片描述
在vite.config.ts中新增如下代码:
在这里插入图片描述

import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
import path from "path"
// https://vitejs.dev/config/
export default defineConfig({
  resolve:{
    alias:{
      "@":path.resolve(__dirname,'src')
    }
  },
  plugins: [vue()],
})

在tsconfig.json中添加代码:
在这里插入图片描述

{
  "compilerOptions": {
    "target": "ES2020",
    "useDefineForClassFields": true,
    "module": "ESNext",
    "lib": ["ES2020", "DOM", "DOM.Iterable"],
    "skipLibCheck": true,

    /* Bundler mode */
    "moduleResolution": "bundler",
    "allowImportingTsExtensions": true,
    "resolveJsonModule": true,
    "isolatedModules": true,
    "noEmit": true,
    "jsx": "preserve",

    /* Linting */
    "strict": true,
    "noUnusedLocals": true,
    "noUnusedParameters": true,
    "noFallthroughCasesInSwitch": true,
    "baseUrl": "./",
    "paths": {
      "@/*":["./src/*"]
    }
  },
  "include": ["src/**/*.ts", "src/**/*.d.ts", "src/**/*.tsx", "src/**/*.vue"],
  "references": [{ "path": "./tsconfig.node.json" }]
}

还是报错,path未找到
在这里插入图片描述
path是node中的工具包,安装一下就行

 npm i path

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

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

相关文章

1990-2021年上市公司债务融资成本数据(原始数据+stata处理代码+计算结果)

1990-2021年上市公司债务融资成本数据(原始数据处理代码计算结果) 1、时间:1990-2021年 2、来源:上市公司年报 3、指标:编码、年份、证券代码、短期借款、长期借款、应付债券、长期应付款、负债合计、行业代码、财务…

实现基于 Jenkins 的多服务器打包方案

实现基于 Jenkins 的多服务器打包方案 在实际项目中,我们经常会遇到需要将一个应用程序或服务部署到不同的服务器上的需求。而使用 Jenkins 可以很方便地自动化这个过程。 设置参数 首先,我们需要设置一些参数,以便在构建过程中指定要部署…

vue项目中隐藏右侧滑动栏,使用鼠标滚轮滑动

直接加一个样式,就什么也不用管了 ::-webkit-scrollbar {display: none; }

解决windows中安装VMware后宿主机wifi网卡无法正常使用的问题

问题描述 笔者在安装了 VMware16 后,出现了宿主机托盘中的wifi图标消失、宿主机无法上网、设备管理器中wifi网卡出现43代码错误等情况。在网上搜索良久,找到的解决方法大多为卸载 VMware16 然后清除注册表中的VMware记录等操作,参考性不是很…

数据结构和算法(14):串

串及串匹配 串或字符串(string)属于线性结构,可直接利用向量或列表等序列结构加以实现:结构简单,规模庞大,元素重复率高。 串 由 n 个字符构成的串记作: S " a 0 a 1 . . . a n − 1 &…

山海鲸数字孪生流域:创新驱动,智能治水

当今社会,水资源管理和防洪治理是一项重要的任务,涉及许多关键领域,如灌溉、供水、排水和防洪。这些任务通常在大规模的流域中进行,涉及复杂的水文和气象数据,需要高效的监测和管理。在这一背景下,山海鲸数…

HTML5语义化标签 header 的详解

🌟🌟🌟 专栏详解 🎉 🎉 🎉 欢迎来到前端开发之旅专栏! 不管你是完全小白,还是有一点经验的开发者,在这里你会了解到最简单易懂的语言,与你分享有关前端技术和…

【三维世界】高性能图形渲染技术——Shader你又了解多少?

目录 前言 什么是 Fragment Shader(片段着色器)? 为什么 shaders 运行特别快? 为什么 Shaders 有名但不好学? Hello World 总结 前言 Shader(着色器)是一种计算机程序,主要用于控制计算机图形学中…

Pandas数据分析系列3-数据如何预览

Pandas-数据预览 Pandas 导入数据后,我们通常需要对数据进行预览,以便更好的进行数据分析。常见数据预览的方法如下: ①head() 方法 功能:读取数据的前几行,默认显示前5行 语法结构:df.head(行数) df1=pd.read_excel("销售表.xlsx",sheet_name="手机销…

【API篇】九、Flink的水位线

文章目录 1、Flink时间语义2、事件时间和窗口3、水位线4、水位线和窗口的工作原理 1、Flink时间语义 事件时间处理时间 举个例子就是,一条数据在23:59:59产生,在00:00:01被处理,前者为事件时间,后者为处理时间。 从Flink1.12版本…

Flask 上传文件,requests通过接口上传文件

这是一个使用 Flask 框架实现文件上传功能的示例代码。该代码定义了两个路由: /upload:处理文件上传请求。在该路由中,我们首先从请求中获取上传的文件,然后将文件保存到本地磁盘上,并返回一个字符串表示上传成功。 /…

Python机器学习17——Xgboost和Lightgbm结合分位数回归(机器学习与传统统计学结合)

最近XGboost支持分位数回归了,我看了一下,就做了个小的代码案例。毕竟学术市场上做这种新颖的机器学习和传统统计学结合的方法还是不多,算的上创新,找个好数据集可以发论文。 代码实现 导入包 import numpy as np import pandas…

【单例模式】饿汉式,懒汉式?JAVA如何实现单例?线程安全吗?

个人简介:Java领域新星创作者;阿里云技术博主、星级博主、专家博主;正在Java学习的路上摸爬滚打,记录学习的过程~ 个人主页:.29.的博客 学习社区:进去逛一逛~ 单例设计模式 Java单例设计模式 Java单例设计模…

微信消息弹窗升级优化了,在微信打开时也能收到新消息显示。

最近,微信又更新了。微信对消息弹窗进行了升级优化,在微信打开时也能收到新消息显示。 点击「我」-「设置」-「消息通知」,可以看到新增了「横幅显示内容」选项。 有3种内容显示形式,分别为:仅显示你收到1条消息&#…

『 基础算法题解 』之双指针(上)

双指针 文章目录 双指针移动零题目解析算法原理代码拓展 复写零题目解析算法原理代码 快乐数题目解析算法解析拓展 代码 盛最多水的容器题目解析算法解析代码 有效的三角形个数题目解析算法原理代码 移动零 题目解析 【题目链接】 算法原理 该种题目可以归为一类题数组分块\…

想要精通算法和SQL的成长之路 - 最小高度树

想要精通算法和SQL的成长之路 - 最小高度树 前言一. 最小高度树1.1 邻接表的构建1.2 入度为1的先入队1.3 BFS遍历 前言 想要精通算法和SQL的成长之路 - 系列导航 一. 最小高度树 原题链接 从题目的含义中我们可以发现: 题目的树是一颗多叉树。叶子节点的度为1&a…

你的支付环境是否安全?

1、平台支付逻辑全流程分析分析 2、平台支付漏洞如何利用?买东西还送钱? 3、BURP抓包分析修改支付金额,伪造交易状态? 4、修改购物车参数实现底价购买商品 5、SRC、CTF、HW项目月入10W副业之路 6、如何构建最适合自己的网安学习路…

【项目经理】目标管理工具

目标管理工具 1. WBS 任务分解法👊原则方法标准 2. 6W2H法WhatwhyWhowhen⏲️WhereWhichHowHow much 3. SWOT分析法strengths-优势Weaknesses-劣势Opportunities-机会Threats-威胁 4. 二八原则法巴列特定律准则例子 5. SMART原则SpecificMeasurableAttainableReleva…

处于十字路口的CIO:继续进化还是走进死胡同

2023年初Forrester研究给出的一个坏消息表明,有很多CIO尚未准备好满足这些新的需求。大多数CIO(58%)仍处于Forrester所说的传统IT领导模式;有37%的CIO被认为是“现代的”,但只有6%的CIO是“适合未来的”,具…

YOLOv8优化:独家创新(SC_C_Detect)检测头结构创新,实现涨点 | 检测头新颖创新系列

💡💡💡本文独家改进:独家创新(SC_C_Detect)检测头结构创新,适合科研创新度十足,强烈推荐 SC_C_Detect | 亲测在多个数据集能够实现大幅涨点 💡💡💡Yolov8魔术师,独家首发创新(原创),适用于Yolov5、Yolov7、Yolov8等各个Yolo系列,专栏文章提供每一步步…