Vue打包部署

devtools/2024/11/15 4:46:35/

黑马程序员JavaWeb开发教程

文章目录

  • 一、打包
  • 二、部署
    • 1、Nginx服务器
    • 2、下载Nginx
    • 3、部署
    • 4、更换Nginx的端口号

一、打包

  1. 直接点击NPM脚本下的build 即可
    在这里插入图片描述
  2. 打包完成之后会产生一个dist文件夹,之后部署的时候就是使用dist文件夹下的文件
    在这里插入图片描述

二、部署

1、Nginx服务器

  1. 介绍:Nginx 是一款轻量级的Web服务器/反向代理服务器及电子邮件代理服务器。其特点是占有内存少,并发能力强,在各大型互联网公司都有广泛的使用
  2. 官网:https://nginx.org/

2、下载Nginx

  1. 访问官网,点击download
    在这里插入图片描述
  2. 选择当前稳定版本
    在这里插入图片描述
  3. 右键解压,nginx当中的文件目录如下所示
    在这里插入图片描述

3、部署

1.将打包好的 dist 目录下的文件,复制到 nginx 安装目录的 html 目录下

在这里插入图片描述
2. 启动 nginx 双击 nginx.exe 文件,会发现可能打不开,查看 log 中的 error.log 会发现有如下错误提示
2024/04/18 09:59:24 [emerg] 10676#14408: bind() to 0.0.0.0:80 failed (10013: An attempt was made to access a socket in a way forbidden by its access permissions)
说明80端口被占用了,此时需要更换 nginx 的端口号

4、更换Nginx的端口号

  1. 在 conf 目录下找到 nginx.conf ,打开
    在这里插入图片描述

  2. 将80 改成 90
    在这里插入图片描述

  3. 双击 nginx.exe 文件 ,打开任务管理器,查看是否存在nginx的进程
    在这里插入图片描述

  4. 在浏览器访问 localhost:90,此时就访问到了刚才打包好的项目
    在这里插入图片描述


http://www.ppmy.cn/devtools/11005.html

相关文章

k8s的服务Service暴露应用

k8s的服务Service暴露应用 Kubernetes(k8s)是一个开源的容器编排系统,用于自动化应用部署、扩展和管理。在k8s中,Service是管理Pod访问的关键组件,它允许你定义如何访问运行在集群中的Pod。本文将详细介绍Service的概…

基于POI封装的excel实用小工具

依赖文件 <dependency><groupId>org.apache.poi</groupId><artifactId>poi</artifactId></dependency><dependency><groupId>org.apache.poi</groupId><artifactId>poi-ooxml</artifactId></dependency&…

Day13.一刷数据结构算法(C语言版) 102二叉树的层序遍历;226翻转二叉树;101对称二叉树

一.102二叉树的层序遍历 二叉树的层序遍历力扣题目 1.思路分析 这道题我没有什么好的思路&#xff0c;而且力扣给的函数形式看得有点懵&#xff0c;所以我找到一个相对好理解的题解&#xff0c;具体可以参考下方链接。 力扣题解 说明&#xff1a; 返回值&#xff1a;可…

基本数据类型转换

一 自动类型转换 当java程序在进行赋值或者运算时&#xff0c;精度小的类型自动转换为精度大的数据类型 这个就是自动类型转换。 数据类型按精度(容量)大小排序 char -> int -> long -> float -> doublebyte -> short -> int -> long -> float -> …

spring.factories中配置ApplicationContextInitializer实现类却不起作用

自定义了一个ApplicationContextInitializer的实现类如下 public class MyApplicationContextInitializer implements ApplicationContextInitializer<ConfigurableApplicationContext> {Overridepublic void initialize(ConfigurableApplicationContext applicationCon…

走出“至暗时刻”,托举三只松鼠的力量是什么?

品牌是时代的产物&#xff0c;也随时代而变化。能存在超过十年&#xff0c;依旧欣欣向荣的品牌&#xff0c;身上或多或少都承载了关于穿越周期的哲学。 最近的例子是零食行业的三只松鼠&#xff0c;三只松鼠的创业史&#xff0c;内涵非常丰富&#xff0c;有电商和实体的纠缠&a…

基于Springboot的心灵治愈交流平台

基于SpringbootVue的心灵治愈交流平台的设计与实现 开发语言&#xff1a;Java数据库&#xff1a;MySQL技术&#xff1a;SpringbootMybatis工具&#xff1a;IDEA、Maven、Navicat 系统展示 用户登录 首页展示 系统公告 心理咨询师 心灵专栏 压力测试 小纸条 后台登录界面 后…

linux18:进程等待

进程等待的必要性 1&#xff1a;子进程创建的目的是要完成父进程指派的某个任务&#xff0c;当子进程运行完毕退出时&#xff0c;父进程需要通过进程等待的方式&#xff0c;回收子进程资源&#xff0c;获取子进程退出信息&#xff08;子进程有无异常&#xff1f;没有异常结果是…