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://xiahunao.cn/news/2814992.html

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

相关文章

微服务架构 SpringCloud

单体应用架构 将项目所有模块(功能)打成jar或者war,然后部署一个进程--医院挂号系统; > 优点: > 1:部署简单:由于是完整的结构体,可以直接部署在一个服务器上即可。 > 2:技术单一:项目不需要复杂的技术栈,往往一套熟悉的…

选择何种操作系统作为网站服务器

选择操作系统时,需考虑稳定性、安全性、成本、兼容性和技术支持等因素,常见选项有Windows Server和Linux发行版。 选择网站服务器的操作系统是一个关键的决策,因为它将影响到网站的性能、稳定性、安全性以及未来的扩展性,目前市场…

LabVIEW最佳传输系统设计

LabVIEW最佳传输系统设计 介绍了基于LabVIEW软件开发的最佳基带传输系统和最佳带通传输系统的设计。通过软件仿真实现了脉冲成形滤波器和匹配滤波器的设计,证明了系统在消除码间干扰和抗噪声方面的优异性能。此设计不仅激发了学生的学习兴趣,还有助于提…

kafka消费者接收不到消息

背景: 对kafka消息进行监听,生产者发了消息,但是消费端没有接到消息,监听代码 消费端,kafka配置 spring.kafka.bootstrap-serverskafka.cestc.dmp:9591 spring.kafka.properties.sasl.jaas.configorg.apache.kafka.…

《系统架构设计师教程(第2版)》第5章-软件工程基础知识-05-净室软件工程(CSE)

文章目录 1. 概述2. 理论基础2.1 函数理论2.2 抽样理论 3. 技术手段3.1 增量式开发3.2 基于函数的规范与设计3.3 正确性验证3.4 统计测试 (Statistically Based Testing) 和软件认证 4. 应用与缺点1)太理论化2)缺少传统模块测试3)带有传统软件…

table展示子级踩坑

##elemenui中table通过row中是否有children进行判断是否展示子集,通过设置tree-prop的属性进行设置,子级的children的名字可以根据自己的子级名字进行替换,当然同样可以对数据处理成含有chilren的子级list。 问题: 1.如果是根据后…

香港服务器选择指南(挑选香港服务器的几个标准)

​  随着全球化的加速和互联网的普及,跨境访问和外贸活动越来越频繁。在这个背景下,香港服务器作为一种国际化的基础设施,受到了广泛欢迎。本文将探讨企业在选择香港服务器时应关注的几个标准事项。 1.可靠性和正常运行时间 停机可能会给企…

LeetCode 0938.二叉搜索树的范围和:深度优先搜索(可中序遍历)

【LetMeFly】938.二叉搜索树的范围和:深度优先搜索(可中序遍历) 力扣题目链接:https://leetcode.cn/problems/range-sum-of-bst/ 给定二叉搜索树的根结点 root,返回值位于范围 [low, high] 之间的所有结点的值的和。…

LVS负载均衡服务器

简介: LVS (Linux Virtual Server):四层路由设备,是由中国人章文松研发的(阿里巴巴的副总裁)根据用户请求的IP与端口号实现将用户的请求分发至不同的主机。 工作原理: LVS工作在一台server上提供Directory(负载均衡器)的功能,本身并不提供服务&#xff…

【QT+QGIS跨平台编译】之五十三:【QGIS_CORE跨平台编译】—【qgssqlstatementparser.cpp生成】

文章目录 一、Bison二、生成来源三、构建过程一、Bison GNU Bison 是一个通用的解析器生成器,它可以将注释的无上下文语法转换为使用 LALR (1) 解析表的确定性 LR 或广义 LR (GLR) 解析器。Bison 还可以生成 IELR (1) 或规范 LR (1) 解析表。一旦您熟练使用 Bison,您可以使用…

2024年留学基金委(CSC) 青年骨干教师出国研修项目公布(附建议)

2月27日,国家留学基金委(CSC)公布了2024年青年骨干教师出国研修项目通知,知识人网小编现将项目指南、申请材料及说明、常见问题解答等原文转载并提出建议。 知识人网建议 一、2024年的通知精神与2023年相比变化不大。 二、建议 …

【零基础入门TypeScript】类 - class

目录 创建类 句法 示例:声明一个类 创建实例对象 句法 示例:实例化一个类 访问属性和函数 示例:将它们放在一起 类继承 句法 示例:类继承 例子 输出 TypeScript ─ 类继承和方法重写 静态关键字 例子 实例操作符…

【前端入门】设计模式+单多页+React

设计模式是一种解决特定问题的经验总结,它提供了经过验证的解决方案,可以在软件开发过程中使用。设计模式可以帮助前端开发人员更有效地组织和管理代码,并提供一种共享的语言和框架,以便与其他开发人员进行交流。 以下是一些常见…

【盲源分离】快速理解FastICA算法(附MATLAB绘图程序)

今天讲一个在信号分析领域较为常用的一个方法,即盲源分离算法中的FastICA。 我们先从一个经典的问题引入。 一、鸡尾酒舞会问题 想象一下,你身处一个熙熙攘攘的鸡尾酒舞会中。四周回荡着各种声音:笑声、交谈声、玻璃碰撞声,甚至…

【C++干货基地】C++:函数重载(深度解析Windows和Linux下函数的修饰规则)

🎬 鸽芷咕:个人主页 🔥 个人专栏: 《C干货基地》《粉丝福利》 ⛺️生活的理想,就是为了理想的生活! 引入 哈喽各位铁汁们好啊,我是博主鸽芷咕《C干货基地》是由我的襄阳家乡零食基地有感而发,不知道各位的…

nacos开启鉴权+springboot配置用户名密码

nacos默认没有开启鉴权,springboot无需用户名密码即可连接nacos。从2.2.2版本开始,默认控制台也无需登录直接可进行操作。 因此本文记录一下如何开启鉴权,基于nacos2.3.0版本。 编辑nacos服务端的application.properties: # 开…

【wow-ts学习笔记】Vue3第一章:模板

本课程是DW内测开源课程wow-ts项目的学习笔记 项目地址: https://github.com/datawhalechina/wow-ts 什么是 Vue3​ Vue (发音为 /vjuː/,类似 view) 是一款用于构建用户界面的 JavaScript 框架。它基于标准 HTML、CSS 和 JavaScript 构建,并…

DCIC 2024 数据要素赛道算力资源申请与使用指南

云资源开通 企业认证通过后,由企业账号申请开通资源池服务 开通资源池服务 控制台左侧菜单【云资源】--【ModelArts】--【开通服务】后,方可申请专属资源,等待申请通过后即可正常使用资源。 OBS Browser使用 对象存储服务OBS是一个基…

css字体随着屏幕自适应

场景: 假设,字体为70px 在大屏显示正常,但是在笔记本上文字就换行了。我想字体随着屏幕变化而变化。 方法: 使用clamp函数,该函数接收三个参数:分别为 最小值,首选值,最大值。 .d…