当前位置: 首页 > news >正文

Vue3学习笔记<->nginx部署vue项目

安装nginx

  vue项目通常部署到nginx上,所以先安装一个nginx。为了方便安装的是windows版nginx,解压就能用。
项目参考上一篇文章《Vue3学习笔记<->创建第一个vue项目》《Vue3学习笔记<->创建第一个vue项目》
nginx下载地址:windows版nginx下载地址

windows版nginx下载
  找到目录存放,并解压
在这里插入图片描述
  双击“nginx.exe”启动
在这里插入图片描述

  关闭nginx,打开"任务管理器",找到“nginx.exe(32 位)”,结束任务。点第一个如果没反应,换第二个点。停掉一个之后,再停另一个。这是我使用的经验,不知道原因。。。
在这里插入图片描述

项目编译

  编译的项目就使用前面文档里的项目。idea打开项目,并进入命令行。如果当前目录不是项目目录,切换项目目录
在这里插入图片描述
  执行编译命令:yarn build 或yarn run build
在这里插入图片描述
  查看打包结果
在这里插入图片描述

部署项目到nginx

  1. 打开nginx安装目录,找到html目录
    在这里插入图片描述

  2. 把dist目录整个复制到html目录下
    在这里插入图片描述
    在这里插入图片描述

  3. 打开nginx安装目录下的conf目录,找到文件“nginx.conf”
    在这里插入图片描述

  4. 打开nginx.conf文件,并编辑内容,
    在这里插入图片描述

  5. 启动nginx,并通过地址"http://localhost:8888", 在浏览器中访问应用。出现一下界面表示部署成功
    在这里插入图片描述

  6. 点击页面上的“count is 0” 按钮,可以看到count在自增

在这里插入图片描述

总结一下。。。

  这里主要说的是部署流程,实际项目部署过程要复杂的多,比如nginx.conf的配置文件中,就需要配置很多内容。实际部署项目的经验不是看几遍文档可以学的了,这个经验要从实际操作的过程中获取。。。

相关文章:

Vue3学习笔记<->nginx部署vue项目

安装nginx vue项目通常部署到nginx上,所以先安装一个nginx。为了方便安装的是windows版nginx,解压就能用。 项目参考上一篇文章《Vue3学习笔记<->创建第一个vue项目》《Vue3学习笔记<->创建第一个vue项目》…...

使用 WebGL 创建 3D 对象

WebGL Demohttps://mdn.github.io/dom-examples/webgl-examples/tutorial/sample5/index.html 现在让我们给之前的正方形添加五个面从而可以创建一个三维的立方体。最简单的方式就是通过调用方法 gl.drawElements() 使用顶点数组列表来替换之前的通过方法gl.drawArrays() 直接…...

百度地图3d区域掩膜,最常见通用的大屏地图展现形式

需求及效果 原本项目使用的是百度地图3.0,也就是2d版本的那个地图,客户不满意觉得不够好看,让把地图改成3d的,但是我们因为另外的系统用的都是百度地图,为了保持统一只能用百度地图做 经过3天的努力,最后我终于把这个…...

小区物业管理收费系统源码小程序

便捷、透明、智能化的新体验 一款基于FastAdminUniApp开发的一款物业收费管理小程序。包含房产管理、收费标准、家属管理、抄表管理、在线缴费、业主公告、统计报表、业主投票、可视化大屏等功能。为物业量身打造的小区收费管理系统,贴合物业工作场景,轻…...

C++实现一个简单的Qt信号槽机制

昨天写这个文章《深入探讨C的高级反射机制(2):写个能用的反射库》的时候就在想,是不是也能在这套反射逻辑的基础上,实现一个类似Qt的信号槽机制? Qt信号槽机制简介 所谓的Qt的信号槽(Signals …...

微信小程序常用的传值

1.通过 URL 传参 在页面跳转时,可以在 URL 中携带参数进行传递,然后在目标页面的 onLoad 生命周期中获取参数。 // 在页面 A 中跳转到页面 B 并传递参数 wx.navigateTo({url: /pages/detail/index?id123 });// 在页面 B 的 onLoad 生命周期中获取参数…...

SQL面试真题解答 数据统计分析,求“同比、环比”等(SQL窗口函数使用)

SQL面试真题解答 数据统计分析,求“同比、环比”等(SQL窗口函数使用) 环比、环比增长率、同比、同比增长率,根据百度百科上的 说明: 环比增长率 环比增长率,一般是指和上期相比较的增长率。 环比增长率&a…...

【递归、搜索与回溯】floodfill算法二

floodfill算法二 1.被围绕的区域2.太平洋大西洋水流问题3.扫雷游戏4.衣橱整理 点赞👍👍收藏🌟🌟关注💖💖 你的支持是对我最大的鼓励,我们一起努力吧!😃😃 1.被围绕的区域…...

Dataease安装,配置Jenkins自动部署

Dataease安装,配置Jenkins自动部署 一.安装Dataease 安装前准备:1.Ubuntu20.04 LTS国内源安装指定版本Docker 2.docker-compose安装 下载离线安装的安装包,下载地址:https://community.fit2cloud.com/#/download/dataease/v1-…...

关于IDEA启动报错 【JAVA_HOME does not point to a valid JM installation】

希望文章能给到你启发和灵感~ 感谢支持和关注~ 阅读指南 一、基础环境说明1.1 硬件环境1.2 软件环境 二、起因 一、基础环境说明 考虑环境因素不同,大家适当的对比自己的软硬件环境情况分析~ 1.1 硬件环境 MacOS Monterey 版本 1…...

设置小蓝熊的CPU亲和性、CPU优先级再设置法环的CPU亲和性

# 适用于Windows系统 # 时间 : 2024-06-28 # 作者 : 三巧(https://blog.csdn.net/qq_39124701) # 文件名 : 设置小蓝熊的CPU亲和性、CPU优先级再设置法环的CPU亲和性.ps1 # 使用方法: 打开记事本,将所有代码复制到记事本中,保存文件时候修改文件后…...

Oracle中的序列(Sequence)是一种数据库对象

Oracle中的序列(Sequence)是一种数据库对象,用于生成数字序列,通常用于为主键列生成唯一、连续的数值。以下是一些使用序列的案例: 1. **为主键生成唯一值**: 在Oracle中,序列最常用的场景是…...

热点观察 | 《姜饼人王国》新作来袭、《Monopoly GO!》荣登5月全球畅销榜榜首

本周出海热点: 1. 中国品牌借欧洲杯打响知名度 2. 米哈游玩家切割二次元 3. 6月27日,Steam游戏《六月衷曲》上线TapTap 4. 《Monopoly GO!》荣登5月全球畅销榜榜首 5. 《地下城与勇士》拿下本周亚洲T1市场畅销榜冠军 6. 《姜饼人王国》新作强势登顶…...

智能网络构建:探索大模型在网络领域的应用

网络领域以其高度复杂性和快速迭代为特点,完成从网络设计、配置、诊断到安全的网络任务需要广泛的专业知识。这些任务的固有复杂性,加上网络技术和协议不断变化的格局,为传统基于机器学习的方法带来了显著的障碍。这些方法在泛化和自动化网络…...

C++编程逻辑讲解step by step:定义一个Person类,它的每个对象表示一个人。

题目 定义一个Person类,它的每个对象表示一个人。数据成员必须包含姓名、出生年份、死亡年份&#xff0c;一个构造函数&#xff0c;一析构函数&#xff0c;读取数据的成员函数&#xff0c;一个print()成员函数显示所有数据。 #include <iostream> using namespace std;…...

DBdoctor产品介绍

基本信息 DBdoctor是一款企业级数据库监控、巡检、性能诊断、SQL审核与优化平台&#xff0c;致力于解决一切数据库性能问题。采用eBPF技术可对数据库做细粒度的扫描&#xff0c;帮助您一分钟内找到数据库性能问题&#xff0c;实现性能诊断百倍提效。针对数据库性能诊断门槛高、…...

一加Ace3 刷机救砖简化说明

注意&#xff1a;工具使用英文目录&#xff0c;支持救砖和降级。PJE110国行版&#xff0c;CPH2609国际版。目前国行版不能完美转换国际版&#xff0c;每次升级都需要刷oplusstanvbk&#xff0c;不建议使用。跨国转换或ROOT一定先解锁Bootloader&#xff0c;可以使用“一加全能工…...

【服务器05】之【登录/注册账号成功转至游戏场景】

Unity登录注册数据库 打开【服务器01】的文章项目 导入新UI系统 点击2D 双击输入栏位置 修改输入框尺寸及位置 放大字体 修改默认输入文字 发现中文字变成了口口口口 原因是新UI系统不支持中文&#xff0c;解决这个问题需要更换字体 并且修改输入时字体大小 我们取电脑中找Fon…...

平价蓝牙耳机推荐性价比高,性价比高的蓝牙耳机学生党推荐

市场上的蓝牙耳机价格从几十元到几百甚至上千不等&#xff0c;性能与价格也呈现多样化&#xff0c;对于学生党来说&#xff0c;一个理想的选择是那些性价比高的平价蓝牙耳机&#xff0c;它们在不牺牲必要功能的同时&#xff0c;提供了可接受的音质和足够的便利性&#xff0c;接…...

【华为战报】5月、6月HCIP考试战报!

华为认证&#xff1a;HCIA-HCIP-HCIE 点击查看&#xff1a; 【华为战报】4月 HCIP考试战报&#xff01; 【华为战报】2月、3月HCIP考试战报&#xff01; 【华为战报】11月份HCIP考试战报&#xff01; 【HCIE喜报】HCIE备考2个月丝滑通关&#xff0c;考试心得分享&#xff…...

OBD诊断

文章目录 OBD 参考标准OBD 服务OBD服务中的DTCOBD服务中0x03和0x07的区别参考 OBD 参考标准 OBD的标准&#xff1a; ISO 15031 Road Vehicles-Communication between vehicle and external equipment for emission-related diagnostics OBD 服务 序号ID服务说明服务详解10x0…...

Elasticsearch 聚合查询

Hi~&#xff01;这里是奋斗的小羊&#xff0c;很荣幸您能阅读我的文章&#xff0c;诚请评论指点&#xff0c;欢迎欢迎 ~~ &#x1f4a5;&#x1f4a5;个人主页&#xff1a;奋斗的小羊 &#x1f4a5;&#x1f4a5;所属专栏&#xff1a;C语言 &#x1f680;本系列文章为个人学习…...

adb remount fails - mount: ‘system‘ not in /proc/mounts 解决办法

mount -o rw,remount /挂载根 mount -o ro,remount /将状态重置为“ro” 以下是我个人的一些话 我热衷于在网络上分享我遇到的问题和解决方案。如果你有任何问题或需要帮助&#xff0c;欢迎留言交流&#xff0c;在共同学习的道路上一起进步。我很高兴结识那些在学习上积极进取…...

百元蓝牙耳机推荐2024哪个好?蓝牙耳机性价比之王推荐

现在的百元价位的蓝牙耳机成为了许多消费者入门级的选择&#xff0c;它不仅需要满足基础的通话需求&#xff0c;更要在音质、舒适度、续航能力等多方面达到一定的标准&#xff0c;随着技术的发展和市场的竞争激烈&#xff0c;各大品牌在这一价格区间推出了极具竞争力的产品&…...

Spring项目报错解读与全部报错详解

你好,我是Qiuner. 为帮助别人少走弯路和记录自己编程学习过程而写博客 这是我的 github https://github.com/Qiuner ⭐️ ​ gitee https://gitee.com/Qiuner &#x1f339; 如果本篇文章帮到了你 不妨点个赞吧~ 我会很高兴的 &#x1f604; (^ ~ ^) 想看更多 那就点个关注吧 我…...

10秒教会你mysql的连接

连接MySQL数据库通常可以通过多种方法实现&#xff0c;以下是几种常见的方法&#xff0c;我将按照您的要求以清晰、分点的方式归纳说明&#xff1a; 1. 使用MySQL命令行客户端 打开终端或命令提示符&#xff1a;首先&#xff0c;打开您的计算机上的终端或命令提示符窗口。输入…...

万物皆可爬——亮数据代理IP+Python爬虫批量下载百度图片助力AI训练

&#x1f482; 个人网站:【 摸鱼游戏】【神级代码资源网站】【导航大全】&#x1f91f; 一站式轻松构建小程序、Web网站、移动应用&#xff1a;&#x1f449;注册地址&#x1f91f; 基于Web端打造的&#xff1a;&#x1f449;轻量化工具创作平台&#x1f485; 想寻找共同学习交…...

OpenCv形态学(一)

目录 形态学转换 结构元素 腐蚀 膨胀 开运算 闭运算 形态学梯度 顶帽 黑帽 图像轮廓 查找轮廓 绘制轮廓 形态学转换 形态变换是一些基于图像形状的简单操作。通常在二值图像上执行。它需要两个输入&#xff0c;一个是我们的原始图像&#xff0c;第二个是决定操作性…...

CSS基础汇总

CSS 1. 选择器 标签选择器 通过标签名找标签&#xff08;把指定的样式应用到某一个、组、类标签上&#xff09; id选择器 通过id属性值找标签&#xff0c;关键符号#id值{样式} 复合选择器 1、并列选择器&#xff1a;关键符号&#xff0c;用法&#xff1a;选择器1&#xff0c…...

cocos creator让所有button点击时播放音效

原理&#xff1a; 利用prototype属性&#xff0c;通过重写 cc.Button.prototype._onTouchEnded 方法&#xff0c;以便在按钮被点击时播放音频。通过重写其 _onTouchEnded 方法&#xff0c;可以添加自定义行为&#xff0c;如播放音频。 概念解释&#xff1a; prototype&#…...

mybatisplus自带的雪花算法(IdType.ASSIGN_ID)无法自动生成弊端缺点,以及改进方法

前言 今日在使用mybatisplus的雪花算法自动给id赋值时发现怎么都是null的情况&#xff0c;这尼玛测了半天&#xff0c;终于发现巨坑&#xff0c;废话不多说&#xff0c;直接上干货 IService.save 只有调用IService中的save方法才能正常生成id&#xff0c;像IService.saveBatc…...

单位转换:将kb转换为 MB ,GB等形式

写法一&#xff1a; function formatSizeUnits(kb) {let units [KB, MB, GB, TB, PB,EB,ZB,YB];let unitIndex 0;while (kb > 1024 && unitIndex < units.length - 1) {kb / 1024;unitIndex;}return ${kb.toFixed(2)} ${units[unitIndex]}; } console.log(for…...

优思学院|「按计划推动型」与「需求拉动型」的生产模式

针对生产架构做对比分类的用语&#xff0c;主要有按计划推进型与需求拉动型。 「按计划推动型」与「需求拉动型」两者乃是生产架构上常使用、成对比的两个用语。不过&#xff0c;有时不只用来指单纯的生产现场架构&#xff0c;也有人把它应用在更广泛的生产架构设计上。 按计划…...

解释什么是lambda函数?它有什么好处?

&#x1f49d;&#x1f49d;&#x1f49d;欢迎莅临我的博客&#xff0c;很高兴能够在这里和您见面&#xff01;希望您在这里可以感受到一份轻松愉快的氛围&#xff0c;不仅可以获得有趣的内容和知识&#xff0c;也可以畅所欲言、分享您的想法和见解。 推荐:「stormsha的主页」…...

码农:如何快速融入团队

问题&#xff1a; 码农如何快速融入团队&#xff1f; 记住一个标准&#xff1a;能干事、能抗事。 总结一个字&#xff1a; 靠谱。 适用范围&#xff1a;新手码农、老司机码农、测试、DBA、运维、产品经理、项目经理、架构师、技术专家、。。。。适用于任何行业的打工者。 下面要…...

Android 通知组

一. 通知组简介 从 Android 7.0&#xff08;API 级别 24&#xff09;开始&#xff0c;您可以在一个组中显示相关通知。如下所示: 图 1. 收起&#xff08;顶部&#xff09;和展开&#xff08;底部&#xff09;的通知组。 注意 &#xff1a;如果应用发出 4 条或更多条通知且未…...

【机器学习】ChatTTS:开源文本转语音(text-to-speech)大模型天花板

目录 一、引言 二、TTS&#xff08;text-to-speech&#xff09;模型原理 2.1 VITS 模型架构 2.2 VITS 模型训练 2.3 VITS 模型推理 三、ChatTTS 模型实战 3.1 ChatTTS 简介 3.2 ChatTTS 亮点 3.3 ChatTTS 数据集 3.4 ChatTTS 部署 3.4.1 创建conda环境 3.4.2 拉取源…...

宏集物联网工控屏通过 S7 ETH 协议采集西门子 1200 PLC 数据

前言 为了实现和西门子PLC的数据交互&#xff0c;宏集物联网HMI集成了S7 PPI、S7 MPI、S7 Optimized、S7 ETH等多个驱动来适配西门子200、300、400、1200、1500、LOGO等系列PLC。 本文主要介绍宏集物联网HMI如何通过S7 ETH协议采集西门子1200 PLC的数据&#xff0c;文中详细介…...

C语言学习记录(十一)——指针基本知识及运算

文章目录 前言1. 指针的概念2.指针变量的说明3. 指针的含义4. 指针运算①指针加减&#xff1a;②指针的关系运算符 前言 一个学习嵌入式的小白~ 有问题评论区或私信指出~ 提示&#xff1a;以下是本篇文章正文内容&#xff0c;下面案例可供参考 1. 指针的概念 在C语言中&…...

Oracle中 ROW_NUMBER()的语法及在对应不同需求下应如何使用

Oracle数据库中的ROW_NUMBER()函数是一个窗口函数&#xff0c;它为查询结果集中的每一行分配一个唯一的序号。这个函数在数据分析、分页查询、数据去重和排名问题等方面非常有用。ROW_NUMBER()函数的语法如下&#xff1a; ROW_NUMBER() OVER ( [ PARTITION BY column ] ORDER …...

德邦快递大件可以寄2米长物品吗?大件跨省行李用哪个快递便宜?

搬家或寄送特殊尺寸物品时&#xff0c;快递的选择尤为关键。特别是2米长的大件物品&#xff0c;是否能够承运&#xff1f;哪家快递在跨省大件行李方面更经济&#xff1f;今天&#xff0c;就为你解答这些疑问。 1、祺祺寄快递小程序&#xff1a; “祺祺寄快递”小程序&#xff…...

C# 在WPF .net8.0框架中使用FontAwesome 6和IconFont图标字体

文章目录 一、在WPF中使用FontAwesome 6图标字体1.1 下载FontAwesome1.2 在WPF中配置引用1.2.1 引用FontAwesome字体文件1.2.2 将字体文件已资源的形式生成 1.3 在项目中应用1.3.1 使用方式一&#xff1a;局部引用1.3.2 使用方式二&#xff1a;单个文件中全局引用1.3.3 使用方式…...

万能自定义预约小程序源码系统 适合任何行业在线预约报名 前后端分离 带完整的安装代码包以及搭建教程

系统概述 在当今数字化时代&#xff0c;线上预约已成为各行各业不可或缺的一部分。为满足广大企业和个人对在线预约系统的需求&#xff0c;我们特别推出了这款“万能自定义预约小程序源码系统”。该系统以其高度的灵活性和可扩展性&#xff0c;为各行各业提供了完美的在线预约…...

【MySQL备份】mysqldump篇

目录 1.简介 2.基本用途 3.命令格式 3.1常用选项 3.2常用命令 4.备份脚本 5.定时执行备份脚本 1.简介 mysqldump 是 MySQL 数据库管理系统的命令行实用程序&#xff0c;用于创建数据库的逻辑备份。它能够导出数据库的结构&#xff08;如表结构、视图、触发器等&#xf…...

控制台扫雷(C语言实现)

目录 博文目的实现思路项目创建文件解释 具体实现判断玩家进行游戏还是退出扫雷棋盘的确定地图初始化埋雷玩家扫雷的实现雷判断函数 源码game.cgame.h扫雷.c 博文目的 相信不少人都学习了c语言的函数&#xff0c;循环&#xff0c;分支那我们就可以写一个控制台的扫雷小游戏来检…...

操作系统期末复习 | 批处理程序 | PV实现同步互斥 | 调度算法 | 页面置换算法 | 磁盘调度算法

操作系统引论 批处理程序 单道批处理&#xff1a;引入脱机输入/输出技术&#xff0c;并由监督程序负责控制作业的输入、输出。主要优点是缓解了一定程度的人机速度矛盾&#xff0c;资源利用率有所提升。主要缺点是内存中仅能有一道程序运行&#xff0c;只有该程序运行结束之后…...

字符串的六种遍历方式

在 Java 中&#xff0c;有多种遍历字符串的方法。以下是几种常见的遍历字符串的方法&#xff0c;并附有示例代码 1. 使用 for 循环 这是最常见和基础的遍历方法&#xff0c;通过索引访问每个字符。 public class StringTraversal {public static void main(String[] args) {S…...

在码云(Gitee)上建立分支(Branch)的步骤如下:

步骤一&#xff1a;登录码云 首先&#xff0c;打开码云的官方网站&#xff08;gitee.com&#xff09;&#xff0c;输入用户名和密码登录你的账号。 步骤二&#xff1a;创建仓库 登录后&#xff0c;在页面右上方的搜索框中输入仓库名称&#xff0c;并点击“创建”按钮创建新的仓…...

JVM专题四:JVM的类加载机制

Java中类的加载阶段 类加载 Java中的类加载机制是Java运行时环境的一部分&#xff0c;确保Java类可以被JVM&#xff08;Java虚拟机&#xff09;正确地加载和执行。类加载机制主要分为以下几个阶段&#xff1a; 加载&#xff08;Loading&#xff09;&#xff1a;这个阶段&#x…...

Python爬取中国天气网天气数据.

一、主题式网络爬虫设计方案 1.主题式网络爬虫名称 名称&#xff1a;Python爬取中国天气网天气数据 2.主题式网络爬虫爬取的内容与数据特征分析 本次爬虫主要爬取中国天气网天气数据 3.主题式网络爬虫设计方案概述&#xff08;包括实现思路与技术难点&#xff09; reques…...