Vue使用@别名替换后端ip地址

1. 安装 @types/node

@types/node 包允许您在TypeScript项目中使用Node.js的核心模块和API,并提供了对它们的类型检查和智能提示的支持。

npm install @types/node --save-dev

比如安装之后,就可以导入nodejs的 path模块,在下面代码 import path from "path"; 中,path 是 Node.js 的核心模块之一,用于处理文件路径的操作。它提供了一些方法,用于在不同操作系统上正确解析、拼接和转换文件路径,以及获取路径的各个部分(目录名、文件名、扩展名等)。

2. 在vite.config.ts里面配置resolve

import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
import path from "path";export default defineConfig({plugins: [vue()],server: {host: '0.0.0.0', //允许的主机头port: 5000, // 你需要定义的端口号}resolve: {// 配置路径别名, @就代表当前项目的绝对路径 // __dirname是一个全局变量,表示当前模块所属目录的绝对路径// path.resolve返回一个以相对于当前的工作目录(working directory)的绝对路径, // 比如当前工作目录为 D:\205\wms-web 那么 @ 就代表 D:\205\wms-web\srcalias: {'@': path.resolve(__dirname, './src'),}
},})

4. 如果提示有标红波浪,在tsconfig.app.json 添加如下代码.

   "baseUrl": ".","paths": {"@/*": ["src/*"]}





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

如若内容造成侵权/违法违规/事实不符,请联系长河编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

闪电麦昆 语音控制齿轮行进轨迹,ESP32搭配语音控制板,串口通信,附视频演示地址

演示地址 https://www.bilibili.com/video/BV1cW421d79L/?vd_sourceb8515e53f6d4c564b541d98dcc9df990 语音控制板的配置 web展示页面 esp32 程序 #include <ESP8266WiFi.h> #include <ESP8266WebServer.h> #include <LittleFS.h> #include <WebSo…

STL之set、map的使用

STL之set、map 1. 序列式容器和关联式容器2. set系列的使⽤参考文档链接&#xff1a;2.1 set的介绍&#xff08;2&#xff09;set的增删查2.2 multiset的介绍 3 map3.1 参考文档3.2 map类的介绍3.3 pair类型介绍3.4 map的构造3.6 map的数据修改3.7 multimap和map的差异 1. 序列…

openpdf

1、简介 2、示例 2.1 引入依赖 <dependency><groupId>com.github.librepdf</groupId><artifactId>openpdf</artifactId><version>1.3.34</version></dependency><dependency><groupId>com.github.librepdf</…

python+yaml+pytest+allure接口自动化框架

建议想学自动化的同学&#xff0c;先花半个月一个月的时间&#xff0c;去b站极限学习一下有关python的基础内容&#xff0c;比如各种数据类型的特点&#xff0c;创建 转换等&#xff0c;还有面向对象的一些知识&#xff0c;否则直接看自动化框架&#xff0c;很难看懂理解&#…

根据请求错误的状态码判断代理配置问题

SafeLine&#xff0c;中文名 “雷池”&#xff0c;是一款简单好用, 效果突出的 Web 应用防火墙(WAF)&#xff0c;可以保护 Web 服务不受黑客攻击。 雷池通过过滤和监控 Web 应用与互联网之间的 HTTP 流量来保护 Web 服务。可以保护 Web 服务免受 SQL 注入、XSS、 代码注入、命…

2024顶级一区idea:多模态图像融合!

在图像处理的前沿领域&#xff0c;多模态图像融合技术正成为研究的热点&#xff0c;它通过整合来自不同来源的图像数据&#xff0c;为我们提供了更丰富的信息维度&#xff0c;从而显著提升图像处理的精确度和效率。 这项技术的核心优势在于能够捕捉并融合各种图像数据中的互补…

3D渲图软件推荐:打造高质量渲染效果

在现代设计领域&#xff0c;3D渲图已经成为展示设计方案和产品外观的重要手段。无论是建筑设计、产品设计还是影视动画&#xff0c;都需要借助专业的3D渲染图软件来实现逼真的视觉效果。 本文将为您介绍几款备受好评的3D渲染图软件&#xff0c;帮助您在项目中选择合适的工具。…

户外防火值守:太阳能语音监控杆的参数及技术特点

随着假期旅游的热潮日渐高涨&#xff0c;我们游览各大景区、公园或森林区域时&#xff0c;经常会与各种智能设备不期而遇。这些高科技产品不仅提升了旅游体验&#xff0c;更在无形中保障了游客的安全与景区的环境保护。在我最近的旅行经历中&#xff0c;尤其是在深圳大鹏旅游景…

开放式蓝牙耳机排行榜10强?分享值得安利的开放式耳机

​开放式耳机目前非常流行&#xff0c;它们以时尚、美观和舒适著称&#xff0c;迅速赢得了众多用户的喜爱&#xff0c;成为了耳机市场的新宠。与传统的入耳式耳机相比&#xff0c;开放式耳机佩戴更稳固&#xff0c;对耳朵也更为温和。尽管有些人认为它们价格不菲&#xff0c;甚…

项目_C_Ncurses_Flappy bird小游戏

Ncurses库 概述 什么是Ncurses库&#xff1a; Ncurses是一个管理应用程序在字符终端显示的函数库&#xff0c;库中提供了创建窗口界面、移动光标、产生颜色、处理键盘按键等功能。 安装Ncurses库&#xff1a; sudo apt-get install libncurses5-dev 头文件与编译&#xf…

Springboot自定义starter注入到第三方项目IOC容器里

一 Bean扫描 Springboot项目&#xff0c;我们不加ComponentScan注解&#xff0c;但是也能扫描到Controller、Service标记的类&#xff0c;为什么呢&#xff1f;关键在于启动类的SpringBootApplication注解&#xff0c;该注解由以下三个注解组成&#xff1a; SpringBootConfig…

关于BSV区块链覆盖网络的常见问题解答(下篇)

​​发表时间&#xff1a;2024年9月20日 在BSV区块链上的覆盖网络服务为寻求可扩展、安全、高效交易处理解决方案的开发者和企业家开辟了新的视野。 作为开创性的曼达拉升级的一部分&#xff0c;覆盖网络服务提供了一个强大的框架&#xff0c;用于管理特定类型的交易和数据访问…

如何将 html 渲染后的节点传递给后端?

问题 现在我有一个动态的 html 节点&#xff0c;我想用 vue 渲染后&#xff0c;传递给后端保存 思路 本来想给html的&#xff0c;发现样式是个问题 在一个是打印成pdf&#xff0c;然后上传&#xff0c;这个操作就变多了 最后的思路是通过 html2canvas 转化成 canvas 然后变成…

XUbuntu安装OpenSSH远程连接服务器

目录 打开终端。更新你的包索引安装OpenSSH服务器。在终端中输入以下命令&#xff1a;安装完成后&#xff0c;OpenSSH服务器会自动启动。查看主机 IP测试连接打开 cmd 终端SSH 连接虚拟机确认连接输入连接密码发现问题修改用户&#xff0c;尝试连接 打开终端。 更新你的包索引 …

在 Android 上恢复已删除文件的 5 种简单方法

您可能会因为意外删除、未完成的 Android 更新、手机意外关机等原因而丢失 Android 上的重要数据。新技术的发展使许多手机功能或程序能够从内部恢复丢失的数据。 在 Android 上恢复已删除文件的 5 种简单方法 然而恢复成功率的不确定性也成为人们克服数据丢失困境的重要考虑因…

安卓13禁止锁屏 关闭锁屏 android13禁止锁屏 关闭锁屏

总纲 android13 rom 开发总纲说明 文章目录 1.前言2.问题分析3.代码分析4.代码修改5.彩蛋1.前言 设置 =》安全 =》屏幕锁定 =》 无。 我们通过修改系统屏幕锁定配置,来达到设置屏幕不锁屏的配置。像网上好多文章都只写了在哪里改,改什么东西,但是实际上并未写明为什么要改那…

鸿蒙NEXT开发-面试题库(最新)

注意&#xff1a;博主有个鸿蒙专栏&#xff0c;里面从上到下有关于鸿蒙next的教学文档&#xff0c;大家感兴趣可以学习下 如果大家觉得博主文章写的好的话&#xff0c;可以点下关注&#xff0c;博主会一直更新鸿蒙next相关知识 专栏地址: https://blog.csdn.net/qq_56760790/…

SQL Server 2022 RTM Cumulative Update #15 发布下载

SQL Server 2022 RTM Cumulative Update #15 发布下载 最新的累积更新 (CU) 下载&#xff0c;包含自 SQL Server 2022 RTM 发布以来的所有更新。 请访问原文链接&#xff1a;https://sysin.org/blog/sql-server-2022/&#xff0c;查看最新版。原创作品&#xff0c;转载请保留…

物联网智能项目(含案例说明)

物联网&#xff08;Internet of Things&#xff0c;简称IoT&#xff09;智能项目是指利用物联网技术将各种物理设备、传感器、软件、网络等连接起来&#xff0c;实现设备之间的互联互通&#xff0c;并通过数据采集、传输、处理和分析&#xff0c;实现智能化管理和控制的项目。以…

ARM嵌入式学习--第二天

-指令流水线 -基础知识 1.流水线技术通过多个功能部件并行工作来缩短程序执行时间&#xff0c;提高处理器的效率和吞吐率 2.增加流水线级数&#xff0c;可以简化流水线的各级逻辑&#xff0c;进一步提高了处理器的性能 3.以三级流水线分析&#xff1a; pc代表程序计数器&#x…