Windows server上用nginx部署vue3项目

Windows server上用nginx部署vue3项目

  • 一、Node中node_modules文件夹及package.json文件的作用说明
  • 二、VUE3项目打包
  • 三、Windows Server上的Nginx部署


一、Node中node_modules文件夹及package.json文件的作用说明

node_modules是安装node后用来存放用包管理工具下载安装的包的文件夹,更多细节请见以下链接:

Node中node_modules文件夹及package.json文件的作用说明

运行npm install命令的时候会发生什么?

VUE3项目的工程目录中,通过以下命令可生成node_modules文件夹。

npm install

下面,我们将从VUE3项目打包和Windows Server上的Nginx部署两个方面描述Windows server上用nginx部署vue3项目的整个过程。

二、VUE3项目打包

VUE3项目的打包命令是:

(1)安装Nodejs。点击 Nodejs可跳转至Nodejs的官方下载地址。

(2)进入VUE3项目的工程目录(如下图所示),同时按住“Shift + 鼠标右键”,在弹出的菜单中选择“在此处打开Powershell窗口”选项。
在这里插入图片描述
如此便进入了Powershell命令行界面,如下图所示。
在这里插入图片描述
我们可以执行以下命令(前端打包命令),对该VUE3项目进行打包

npm run build

这里同样补充了一些npm常用命令:

  1. 前端笔记(2) npm常用命令总结

这时,出现以下错误提示:Vite不是内部或外部命令,也不是可运行的程序
在这里插入图片描述
通过查阅资料,继续执行以下命令:

npm install -g vite

再次执行打包命令,

npm run build

还是报错,错误信息如下图所示。
在这里插入图片描述
(3)通过以下命令来更新packages,

npm i

之后,再用npm run build来打包,显示成功,如下图所示。
在这里插入图片描述

(4)打包完成后,在该工程的目录中会生成一个名为dist的文件夹,里面有形成需要部署的文件。


三、Windows Server上的Nginx部署

点击 Nginx可跳转至Nginx的官方下载地址。

Nginx安装包目录中,可以通过以下命令启动Nginx服务:

start nginx.exe  //启动
nginx.exe -t    //检查配置文件是否有错
nginx.exe -s reload    //更新配置文件
nginx.exe -s stop    //快速关闭nginx,不建议使用
nginx.exe -s quit    //等待工作进程处理完成后关闭

这里,nginx给出以下错误信息:
Windows:nginx: [error] CreateFile() “/logs/nginx.pid“ failed (2: The system)
在这里插入图片描述
经分析,造成上述错误的本质原因是:后台开启了太多nginx进程。因此,通过“Windows任务管理器”,关闭过多的nginx进程就可以解决该问题。

其它错误:
Windows环境搭建nginx出现500的错误

CSDN上一个类似的帖子如下:

Windows:nginx: [error] CreateFile() “/logs/nginx.pid“ failed (2: The system)


​ 【彩蛋来了】

看完作者写的这篇博文,请参见:

  1. windows server 用nginx部署vue3项目

  2. 使用Nginx部署Vue项目全过程及踩坑记录

  3. Nginx 配置详解

  4. Vue3+Vite3多项目Nginx部署

  5. nginx 部署vue 3

  6. Nginx之部署Vue3项目

created in 2023.08.03,updated in 2023.08.03

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

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

相关文章

Linux中安装Node

安装 先从 官方网站 下载安装包,有时 node 版本太新会导致失败,详见下方的常见问题第2点 cd /home // 创建目录,将下载好的 node 安装包上传到此目录 mkdir Download mkdir /usr/local/lib/node解压 // 解压,前面是文件当前路径…

vue2中使用mock数据发送请求

1.安装 npm i mockjs1.1 2.准备json数据 说明:mock数据需要的图片放置到public文件夹中(原封不动的打包到dist文件夹) [{"id": "1","imgUrl": "/images/banner1.jpg"},{"id": "2&qu…

基于Orangepi 3 lts 的云台相机

利用orangepi 3 lts 和arduino nano 制作了一个云台相机,可用于室内监控。 硬件: orangepi 3 ,arduino nano ,usb相机,180度舵机两个 WeChat_20230806213004 软件: 整体采用mqtt进行消息的中转。 相机采用python 利用opencv…

Python3 处理PDF之PyMuPDF 入门

PyMuPDF 简介 PyMuPDF是一个用于处理PDF文件的Python库,它提供了丰富的功能来操作、分析和转换PDF文档。这个库的设计目标是提供一个简单易用的API,使得开发者能够轻松地在Python程序中实现PDF文件的各种操作。 PyMuPDF的主要特点如下: 跨平台兼容性&a…

ACL访问控制列表

ACL介绍 acl: 访问控制列表 步骤: 创建一个访问控制规则调用这个规则 ACL的分类和标识 ACL的匹配顺序以及匹配结果 拓扑图 配置 # 首先通过三层交换的实验做一次 ....## 检测ip地址 display ip interface brief## 在交换机2上做配置 [S2]acl name test ?IN…

【Java可执行命令】(十六)诊断命令请求发送工具 jcmd:提供一种简单而强大的方式来管理和监控 Java 进程 ~

Java可执行命令之jcmd 1️⃣ 概念2️⃣ 优势和缺点3️⃣ 使用3.1 语法格式3.2 jcmd -l&#xff1a;列出正在运行的 Java 进程3.3 jcmd < pid> help&#xff1a;列出特定进程的诊断命令列表3.4 jcmd < pid> < command>&#xff1a;执行诊断命令 4️⃣ 应用场景…

【C++】开源:事件驱动网络库libevent配置使用

&#x1f60f;★,:.☆(&#xffe3;▽&#xffe3;)/$:.★ &#x1f60f; 这篇文章主要介绍事件驱动库libevent配置使用。 无专精则不能成&#xff0c;无涉猎则不能通。——梁启超 欢迎来到我的博客&#xff0c;一起学习&#xff0c;共同进步。 喜欢的朋友可以关注一下&#xf…

Qt应用开发(基础篇)——时间类 QDateTime、QDate、QTime

一、前言 时间类QDateTime、QDate、QTime、QTimeZone保存了Qt的时间、日期、时区信息&#xff0c;常用的时间类部件都会用到这些数据结构&#xff0c;常用概念有年、月、日、时、分、秒、毫秒和时区&#xff0c;时间和时区就关系到时间戳和UTC的概念。 UTC时间&#xff0c;又称…

大模型使用——超算上部署LLAMA-2-70B-Chat

大模型使用——超算上部署LLAMA-2-70B-Chat 前言 1、本机为Inspiron 5005&#xff0c;为64位&#xff0c;所用操作系统为Windos 10。超算的操作系统为基于Centos的linux&#xff0c;GPU配置为A100&#xff0c;所使用开发环境为Anaconda。 2、本教程主要实现了在超算上部署LLAM…

零知识证明技术概述

简述 隐私泄露问题给企业带来了巨大的损失&#xff0c;本文简述零知识证明技术并且给出对应的应用示例&#xff1a; 什么是零知识证明&#xff1f; 零知识证明又被称为零知识协议&#xff0c;利用数学知识在双方不需要直接传递信息本身的前提下来验证信息的正确性。这个思想…

华为PMS API client token auth failed

对接华为pms时出现问题&#xff0c;提示华为PMS API client token auth failed 主要是权限的问题&#xff0c;创建项目的时候选择N/A

Windows11 家庭中文版关于本地组策略编辑器gpedit.msc找不到即打不开的解决办法(征诚小张售后实测有效)

Windows11 家庭中文版关于本地组策略编辑器gpedit.msc找不到即打不开的解决办法 根本原因&#xff1a;是因为Windows11家庭中文版的 版本系统没内置安装本地策略组编辑器 好了废话不多说 直接说解决办法 第一步 首先电脑上新建一个空文本文件 输入以下内容&#xff1a; echo o…