2024年前端最新Vue项目部署上线全过程(保姆级教程)_vue项目怎么部署(1),2024年最新2024年京东前端岗面试必问

框架相关

原生JS虽能实现绝大部分功能,但要么就是过于繁琐,要么就是存在缺陷,故绝大多数开发者都会首选框架开发方案。现阶段较热门是React、Vue两大框架,两者工作原理上存在共通点,也存在一些不同点,对于校招来说,不需要两个框架都学得特别熟,一般面试官会针对你简历中写的框架进行提问。

在框架方面,生命周期、钩子函数、虚拟DOM这些基本知识是必须要掌握的,在学习的过程可以结合框架的官方文档

开源分享:【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】

Vue框架

知识要点:
1. vue-cli工程
2. vue核心知识点
3. vue-router
4. vuex
5. http请求
6. UI样式
7. 常用功能
8. MVVM设计模式

React框架

知识要点:
1. 基本知识
2. React 组件
3. React Redux
4. React 路由

    target: "后端url地址",
    //允许跨域请求
    changeOrigin: true
  }
}

}
})


2.在vue项目根目录运行 npm run build  
 ![在这里插入图片描述](https://img-blog.csdnimg.cn/b9d841ea25c34ec5a68fd895e566982c.png)  
 打包完成后会在根目录生成dist文件夹,这个dist文件夹需要上传到服务器


3.链接云服务器,在 /usr/local/ 下创建 web文件夹 用来存放dist文件夹



//此时已经连接到云服务器
cd /usr/local/
mkdir web


通过可视化工具上传dist文件夹,上传后如下图所示  
 ![在这里插入图片描述](https://img-blog.csdnimg.cn/3db808b0533e4cd2a14c1e354a81aa8b.png)  
 4.安装gcc


检查gcc是否已经安装



gcc -v


![在这里插入图片描述](https://img-blog.csdnimg.cn/1be6a7860a4f42149b646c801a568a3a.png)  
 如未安装 执行安装命令



//centos
yum -y install gcc
//上一步输出版本号的话可以跳过本步骤



> 
> 以下步骤不可跳过
> 
> 
> 


安装 pcre、pcre-devel



yum install -y pcre pcre-devel


![在这里插入图片描述](https://img-blog.csdnimg.cn/743438e4ee5b4cd18d9ea594b0881c87.png)


安装 zlib



yum install -y zlib zlib-devel


![在这里插入图片描述](https://img-blog.csdnimg.cn/85a699e564904afbaf8792826bf55e05.png)  
 ![在这里插入图片描述](https://img-blog.csdnimg.cn/ef99ea5c2e6a430aa35e7ca8affab616.png)  
 出现complete代表成功


安装open ssl



yum install -y openssl openssl-devel


![在这里插入图片描述](https://img-blog.csdnimg.cn/200b0dd6adbb4b10b138fdcb77e74d10.png)  
 ![在这里插入图片描述](https://img-blog.csdnimg.cn/b3d9449400de4b8ab4746744fb46d6ac.png)


#### 安装nginx(重点)


在 /usr/local下新建文件夹



mdkir webserve

cd webserve

//下载nginx
wget http://nginx.org/download/nginx-1.9.9.tar.gz
//解压
tar -zxvf nginx-1.9.9.tar.gz


![在这里插入图片描述](https://img-blog.csdnimg.cn/674b5814f55c41759c3b0c488c75afa2.png)  
 解压成功,切换到安装后的目录



cd /usr/local/webserve/nginx-1.9.9/

总结

  • 框架原理真的深入某一部分具体的代码和实现方式时,要多注意到细节,不要只能写出一个框架。

  • 算法方面很薄弱的,最好多刷一刷,不然影响你的工资和成功率😯

  • 在投递简历之前,最好通过各种渠道找到公司内部的人,先提前了解业务,也可以帮助后期优秀 offer 的决策。

  • 要勇于说不,对于某些 offer 待遇不满意、业务不喜欢,应该相信自己,不要因为当下没有更好的 offer 而投降,一份工作短则一年长则 N 年,为了幸福生活要慎重选择!!!

    开源分享:【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】

喜欢这篇文章文章的小伙伴们点赞+转发支持,你们的支持是我最大的动力!

bs.csdn.net/forums/4304bb5a486d4c3ab8389e65ecb71ac0)**

喜欢这篇文章文章的小伙伴们点赞+转发支持,你们的支持是我最大的动力!

  • 5
    点赞
  • 6
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
将SpringBoot Vue项目部署到Linux服务器需要进行以下步骤: 1. 在服务器上安装Java和Node.js环境。 在Linux中使用命令sudo apt-get install java和sudo apt-get install nodejs安装好Java和Node.js环境。 2. 在服务器上安装Nginx服务器。 在Linux中使用命令sudo apt-get install nginx安装Nginx服务器,并使用sudo service nginx start启动Nginx。 3. 将SpringBoot Vue项目打包成jar包。 在SpringBoot项目根目录下使用命令mvn package打包jar文件。 4. 将打包好的jar文件上传到Linux服务器。 可以使用FTP工具将jar文件上传到Linux服务器的指定目录。 5. 在服务器中生成systemd服务配置。 在Linux中使用命令sudo vi /etc/systemd/system/springboot_vue.service创建配置文件,文件内容如下: [Unit] Description=springboot_vue Application After=syslog.target [Service] User=www-data ExecStart=/usr/bin/java -jar /path/to/jar/springboot_vue.jar SuccessExitStatus=143 [Install] WantedBy=multi-user.target 其中/path/to/jar/为jar文件上传到服务器的目录。 6. 重启systemd和Nginx服务器。 在Linux中分别使用命令sudo systemctl daemon-reload、sudo systemctl enable springboot_vue.service和sudo systemctl restart nginx重启systemd和Nginx服务器。 7. 配置Nginx反向代理。 在Linux中使用命令sudo vi /etc/nginx/sites-available/default修改配置文件,文件内容如下: server { listen 80; server_name your_domain_name; location / { proxy_pass http://localhost:8080; proxy_set_header Host $host; proxy_set_header X-Real-IP $remote_addr; proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for; } } 其中your_domain_name为你的域名。 最后,在浏览器中输入域名就可以访问部署好的SpringBoot Vue项目了。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值