VUE3搭载到服务器

news2025/1/22 20:51:54

1.搭建服务器

使用 Windows 自带的 IIS 作为服务器。
步骤如下:https://blog.csdn.net/qq_62464995/article/details/130140673

同时,上面的步骤中,还使用了 cpolar 将 IIS 本地网址映射到公共网址。

注:
cpolar客户端: http://localhost:9200/#/dashboard
cpolar监听流量包流量: http://localhost:4040
cpolar官方安装使用教程: https://www.cpolar.com/blog/free-release-of-lan-web-site?channel=0&invite=4W3F

1.1 服务器请求测试代码

上面步骤完成后,终端运行命令:cpolar http 8080
运行结果如图:

python 编写如下代码运行:
import requests

response = requests.get(url='https://7d31446b.r27.cpolar.top') # 根据情况添加
print(response)

可以看到,每次代码运行请求网站均 200 回复OK,说明网站搭建成功。

2.VUE3 搭载到服务器

如图,简单的 VUE 项目开发完成后。

修改vue.config.js文件夹中的内容。

const { defineConfig } = require('@vue/cli-service')
module.exports = defineConfig({
  transpileDependencies: true,
  assetsDir: 'static',
  parallel: false,
  publicPath: './'
})

然后使用终端命令:npm run build
之后 VUE 项目生成 dist 文件。复制dist 文件夹下的内容到服务器映射文件下。

如图,我将 dist 文件夹下面的内容全部复制到我的网站映射文件夹下面。

然后访问网站公共网址。可以看到,VUE3布局生效。如图所示网址以及界面。

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

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

相关文章

java springmvc/springboot 项目通过HttpServletRequest对象获取请求体body工具类

请求 测试接口 获取到的 获取到打印出的json字符串里有空格这些,在json解析的时候正常解析为json对象了。 工具类代码 import lombok.extern.slf4j.Slf4j; import org.springframework.web.context.request.RequestContextHolder; import org.springframework.we…

(全部习题答案)研究生英语读写教程基础级教师用书PDF|| 研究生英语读写教程提高级教师用书PDF

研究生英语读写教程基础级教师用书PDF 研究生英语读写教程提高级教师用书PDF pdf下载(完整版下载) (1)研究生英语读写教程基础级教师用书PDF (2)研究生英语读写教程基提高级教师用书PDF

yolov9 瑞芯微芯片rknn部署、地平线芯片Horizon部署、TensorRT部署

特别说明:参考官方开源的yolov9代码、瑞芯微官方文档、地平线的官方文档,如有侵权告知删,谢谢。 模型和完整仿真测试代码,放在github上参考链接 模型和代码。 之前写过yolov8检测、分割、关键点模型的部署的多篇博文,y…

网络安全之内容安全

内容安全 攻击可能只是一个点,防御需要全方面进行 IAE引擎 DFI和DPI技术--- 深度检测技术 DPI --- 深度包检测技术--- 主要针对完整的数据包(数据包分片,分段需要重组),之后对 数据包的内容进行识别。(应用…

分享three.js和cannon.js构建Web 3D场景

使用 three.js,您不再需要花哨的游戏PC或控制台来显示逼真的3D图形。 您甚至不需要下载特殊的应用程序。现在每个人都可以使用智能手机和网络浏览器体验令人惊叹的3D应用程序。 这个惊人的库和充满活力的社区是您在浏览器、笔记本电脑、平板电脑或智能手机上创建游…

HTTP 的 multipart 类型

上一篇文章讲到 http 的 MIME 类型 http MIME 类型 里有一个 multipart 多部分对象集合类型,这个类型 http 指南里有讲到:MIME 中的 multipart(多部分)电子邮件报文中包含多个报文,它们合在一起作为单一的复杂报文发送…

System Verilog 要点概览

二进制 常量 格式:二进制位宽进制符号(b:2;h:16;d:10)数据 1b1 1b0 16habcd 4d10变量 logic a;//一位二进制 logic [3:0]b;//4位二进制 logic [31:0][31:0]c;//32*32位二进制组合/位绑定 {a, 1b1}//高位是a,低位是常数二进制…

go test用法(获取单元测试覆盖率)

go test用法(获取ut覆盖率) 为了提升系统的稳定性,一般公司都会对代码的单元测试覆盖率有一定要求。下面针对golang自带的测试命令go test做讲解。 1 命令 1.1 go test ./… (运行当前目录及所有子目录下的测试用例) …

读《Shape-Guided: Shape-Guided Dual-Memory Learning for 3D Anomaly Detection》

Chu Y M, Chieh L, Hsieh T I, et al. Shape-Guided Dual-Memory Learning for 3D Anomaly Detection[J]. 2023.(为毛paperwithcode上面曾经的榜一引用却只有1) 摘要 专家学习 无监督 第一个专家:局部几何,距离建模 第二个专家&…

【React源码 - 调度任务循环EventLoop】

我们知道在React中有4个核心包、2个关键循环。而React正是在这4个核心包中运行,从输入到输出渲染到web端,主要流程可简单分为一下4步:如下图,本文主要是介绍两大循环中的任务调度循环。 4个核心包: react:…

数据结构 队列

一定义 1.1概述: 队列只允许在一端进行插入操作,而在另一端进行删除操作的线性表 特点:队列是先进先出的线性表 允许插入的一端称为队尾,允许删除的一端是队头 这里我们就介绍链式的 1.2 建立队列 这里说一句 其实不管是栈还…

php基础学习之错误处理(其一)

一,错误处理的概念 错误处理指的是系统(或者用户)在执行某些代码的时候,发现有错误,就会通过错误处理的形式告知程序员,俗称报错 二,错误分类 语法错误:书写的代码不符合 PHP 的语法规范,语法错…

【医学影像】LIDC-IDRI数据集的无痛制作

LIDC-IDRI数据集制作 0.下载0.0 链接汇总0.1 步骤 1.合成CT图reference 0.下载 0.0 链接汇总 LIDC-IDRI官方网址:https://www.cancerimagingarchive.net/nbia-search/?CollectionCriteriaLIDC-IDRINBIA Data Retriever 下载链接:https://wiki.canceri…

基于springboot+vue的编程训练系统(前后端分离)

博主主页:猫头鹰源码 博主简介:Java领域优质创作者、CSDN博客专家、阿里云专家博主、公司架构师、全网粉丝5万、专注Java技术领域和毕业设计项目实战,欢迎高校老师\讲师\同行交流合作 ​主要内容:毕业设计(Javaweb项目|小程序|Pyt…

斯元Z-ONE-China Cybersecurity Tech Landscape·中国网络安全全景图-百度网盘下载

面向全球,斯元Z-ONE正式发布首版「China Cybersecurity Tech Landscape中国网络安全全景图」。 为了提升海外市场对中国网络安全行业的全局认识,方便国际客户及合作伙伴了解中国网络安全科技的赛道分布和国内外厂商对标,助力中国网安厂商出海…

Qt中tableView控件的使用

tableView使用注意事项 tableView在使用时,从工具栏拖动到底层页面后,右键进行选择如下图所示: 此处需要注意的是,需要去修改属性,从UI上修改属性如下所示: 也可以通过代码修改属性: //将其设…

个人玩航拍,如何申请无人机空域?

我们在《年会不能停》一文中,有分享我们在西岭雪山用无人机拍摄的照片和视频,有兴趣可以去回顾。 春节的时候,趁着回老家一趟,又将无人机带了回去,计划拍一下老家的风景。 原本以为穷乡僻壤的地方可以随便飞&#xf…

【c语言】内存函数

欢迎关注个人主页:逸狼 创造不易,可以点点赞吗~ 如有错误,欢迎指出~ 目录 memcpy函数的使用和模拟实现 memcpy函数的使用 memcpy函数的模拟实现 memmove的使用和模拟实现 memmove的使用 memmove的模拟实现 memset函数的使用 memcmp函数…

【Docker】安装及相关的命令

目录 一 Docker简介 1.1 是什么 1.2 优缺点 1.3 应用场景 1.4 安装 二 命令 2.1 Docker基本命令 2.2 Docker镜像命令 2.3 Docker容器命令 一 Docker简介 1.1 是什么 Docker是一个开源的应用容器引擎,它基于Go语言实现,并利用操作系统本身已有的…

Kafka安全模式之身份认证

一、简介 Kafka作为一个分布式的发布-订阅消息系统,在日常项目中被频繁使用,通常情况下无论是生产者还是消费者只要订阅Topic后,即可进行消息的发送和接收。而kafka在0.9.0.0版本后添加了身份认证和权限控制两种安全服务,本文主要…