VUE3搭载到服务器

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 requestsresponse = 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.mzph.cn/news/707549.shtml

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

相关文章

Ant for Blazor做单个表的增删查改

Ant for Blazor做单个表的增删查改 2024年02月27日花了一天时间弄出来了,基本弄好了,vs2022blazor servernet8,引用的AntDesign版本是0.17.4 代码里的model和repository是用自己牛腩代码生成器生成的东西,sqlsugar的,记得在prog…

括号生成(力扣题目22)

题目描述: 数字 n 代表生成括号的对数,请你设计一个函数,用于能够生成所有可能的并且 有效的 括号组合。 示例 1: 输入:n 3 输出:["((()))","(()())","(())()&q…

Modern C++ std::any的实现原理

1. 前言 std::any 是 C17 中引入的一个新特性,它是一个类型安全的容器,可以在其中存储任何类型(但此类型必须可拷贝构造)的值,包括基本类型、自定义类型、指针等。相比于void* 指针,std::any 更为类型安全,可以避免由…

NC65 rest接口 开发 NC65接口开发

一、在对应模块META-INF下编写 xxx.rest 文件,也要放在Home里对应的目录下。 二、开发接口,继承extends AbstractUAPRestResource,(有的项目会继承别的方法如:AbstractNCCRestResource,MTFRestResource;有…

使用 kubeadm 部署k8s集群

一、所有节点系统初始化 1、常规初始化 2、内核版本升级以及内核限制文件参数修改 还可以考虑将旧版本的内核卸载 二、准备nginx负载均衡器和keepalived nginx四层代理: keepalived配置: nginx检测脚本: 三、所有节点部署docker&#xff0c…

SQL函数学习记录

聚合函数 函数是编程语言的基础之一,在对数字的运算中,我们用的最多的就是聚合函数,本篇接下来就详细阐述下SQL中聚合函数的运用。 什么是聚合函数(aggregate function)? 聚合函数指的是对一组值执行计算…

2023秋季飞书未来无限大会--随笔

这个时代的飞书 数字时代 工作协同平台 AI时代 帮助企业和个人用好AI 企业如何引用大模型能力? 智慧体— 接近人,有进步空间智能伙伴 用时代的科技打造爱不释手的好产品 移动互联网 – 改变信息分发方式 大模型 –自然的人机交互方式 业务协同 …

如何使用便签快速分类工作待办事项

在日常工作和生活中,我们经常需要处理各种各样的待办事项。而有效地分类这些任务,可以帮助我们更好地管理时间和提高工作效率。使用便签是一种简单而实用的方法,下面将介绍如何利用好用便签来快速分类工作待办事项。 首先,你可以…

【数据结构和算法初阶(C语言)】链表-单链表(手撕详讲单链表增删查改)

目录 1.前言:顺序表回顾: 1.1顺序表的优缺点 2.主角----链表 2.1链表的概念 2.2定义一个单链表的具体实现代码方式 3.单链表对数据的管理----增删查改 3.1单链表的创建 3.2单链表的遍历实现 3.2.1利用遍历实现一个打印我们链表内容的函数的函数…

【前端素材】推荐优质后台管理系统Salreo平台模板(附源码)

一、需求分析 当我们从多个层次来详细分析后台管理系统时,可以将其功能和定义进一步细分,以便更好地理解其在不同方面的作用和实际运作。 1. 结构层次 在结构层次上,后台管理系统可以分为以下几个部分: a. 辅助功能模块&#…

Mycat核心教程--ZooKeeper集群搭建【三】

Mycat核心教程--ZooKeeper集群搭建 八、 ZooKeeper集群搭建8.1.ZooKeeper简介8.2.数据复制的好处8.3.Zookeeper设计目的8.4.zookeeper集群包括3种角色8.4.1.Leader角色8.4.2.Follower 角色8.4.3.Observer 角色 8.5.zookeeper集群工作流程8.6.zookeeper集群节点数量为奇数&#…

JS进阶——深入对象

版权声明 本文章来源于B站上的某马课程,由本人整理,仅供学习交流使用。如涉及侵权问题,请立即与本人联系,本人将积极配合删除相关内容。感谢理解和支持,本人致力于维护原创作品的权益,共同营造一个尊重知识…

liunx操作系统 进程的基本概念

进程的基本概念 计算机结构体系冯诺依曼 操作系统的管理进程进程的特性标识符系统的调用 创建新的进程 进程的状态进程队列进程的状态在liunx查看进程状态、 计算机结构体系 冯诺依曼 在没有存储器之前,所有的信息都是直接进入CPU,这样效率很差&#xf…

智慧公厕:打造智慧城市环境卫生新标杆

随着科技的不断发展和城市化进程的加速推进,智慧城市建设已经成为各地政府和企业关注的焦点。而作为智慧城市环境卫生管理的基础设施,智慧公厕的建设和发展也备受重视,被誉为智慧城市的新标杆。本文以智慧公厕源头厂家广州中期科技有限公司&a…

Java代码实现获取本机服务的IP地址

要通过Java代码获取一个IP地址的信息,你可以使用多种方法。其中一种常见的做法是通过IP地址查询服务API来获取详细信息,比如地理位置、ISP(互联网服务提供商)等。这里有一个简单的例子,展示如何使用Java代码调用一个公…

RRT算法学习及MATLAB演示

文章目录 1 前言2 算法简介3 MATLAB实现3.1 定义地图3.2 绘制地图3.3 定义参数3.4 绘制起点和终点3.5 RRT算法3.5.1 代码3.5.2 效果3.5.3 代码解读 4 参考5 完整代码 1 前言 RRT(Rapid Random Tree)算法,即快速随机树算法,是LaVa…

Latex中大括号书写多行方式【已解决】

在写论文时需要写一个非1即0的公式,因此写了这篇文章。 本文主要分为两个部分:1.在括号外赋值、2、在括号内赋值 1.在括号外赋值 示例 \begin{equation}A\begin{cases}1x, x \textgreater 0\\1-x, x \leq 0 \end{cases} \label{KD} \end{equation} 效…

Dockerfile(4) - RUN 指令详解

RUN 运行命令 shell 形式 命令在 shell 中运行Linux 上默认为 /bin/sh -cWindows 上 cmd /S /C RUN <command> exec 形式 RUN ["executable", "param1", "param2"] 必须双引号&#xff0c;不能是单引号 两种写法的实际栗子 RUN …

CrossOver2024电脑虚拟机软件详细介绍概述

CrossOver是由CodeWeavers开发的一款系统兼容软件&#xff0c;它能够在Mac和Linux操作系统上直接运行Windows应用程序&#xff0c;而无需创建或启动完整的Windows虚拟机。CrossOver通过模拟Windows应用程序所需的运行环境&#xff0c;实现了跨平台的无缝集成和高效运行。 Cross…

unity学习(42)——创建(create)角色脚本(panel)——UserHandler(收)+CreateClick(发)——服务器收包1

1.首先保证服务器接受到的信息正确&#xff0c;在服务器的LogicHandler.cs中做第一次分拣&#xff1a; public void process(Session session, SocketModel model) {try{switch (model.Type){case 0:LoginHandler.getInstance().process(session, model);break;case 1:MapHand…