centos7 部署vue项目(前后端分离、nginx)
一、环境准备
1、centos7系统
2、mysql数据库
3、在centos7虚拟机上安装好nginx
二、部署内容准备
1、后端war包 或者可执行jar
因为我这里是spring boot项目。我就以可执行jar文件作为后端部署内容,如果是war包,则需要部署在web容器中,这个很简单,不多说。
首先右键点击自己要部署的项目,run as---->maven insatll 打包
找到打包好的jar,复制到centos上,
执行 java -jar XXXX.jar,后台正常启动,
2、前端,VUE静态资源。
如果没有安装过node的先安装node 、npm
进入前端项目根目录,执行 nmp run build
构建完成后,可以看到前端项目根目录下多了一个dist文件夹,这就是要部署的前台文件,
复制dist文件夹到centos下,
3.修改nginx配置文件。
vi /usr/local/nginx/conf/nginx.conf
新建server 节点
server {
listen 8001;
server_name 192.168.0.178; location /lic/ {
alias /usr/local/renren/dist/;
index index.html index.htm;
} }
检查配置文件是否正确
./nginx -t
重新加载nginx配置
./nginx -s reload
检查端口,并开放8001端口,
浏览器访问:
http://192.168.0.178:8001/lic/
一切正常。
这里有几个问题需要注意:
第一,前台项目的路径和nginx配置文件中配置的路径需要一直。这里用的root用户,如果用其他用户,可能访问静态资源会被禁止访问(403),需要“chmod 755 静态资源路径 ” 授权,授权的时候要逐级授权,
比如、 chmod 755 /usr/local/renren/dist
chmod 755 /usr/local/renren
chmod 755 /usr/local/
chmod 755 /usr
chmod 644 /usr/local/renren/dist/*
第二,nginx配置文件中配置时,没有用root ,而是使用alias
centos7 部署vue项目(前后端分离、nginx)的更多相关文章
- docker-compose 部署 Vue+SpringBoot 前后端分离项目
一.前言 本文将通过docker-compose来部署前端Vue项目到Nginx中,和运行后端SpringBoot项目 服务器基本环境: CentOS7.3 Dokcer MySQL 二.docker ...
- Vue的学习总结之---Vue项目 前后端分离模式解决开发环境的跨域问题
原文:https://blog.csdn.net/localhost_1314/article/details/83623526 在前后端分离的web开发中,我们与后台联调时,会遇到跨域的问题. 比如 ...
- 基于Vue的前后端分离项目实践
一.为什么需要前后端分离 1.1什么是前后端分离 前后端分离这个词刚在毕业(15年)那会就听说过,但是直到17年前都没有接触过前后端分离的项目.怎么理解前后端分离?直观的感觉就是前后端分开去做,即功 ...
- linux项目部署(非前后端分离crm)
参考博客 参考博客2---部署过程 导论:看参考博客1 WSGI是Web服务器网关接口.它是一个规范,描述了Web服务器如何与Web应用程序通信,以及Web应用程序如何链接在一起以处理一个请求,(接收 ...
- gin+vue的前后端分离开源项目
该项目是gin+vue的前后端分离项目,使用gorm访问MySQL,其中vue前端是使用vue-element-admin框架简单实现的: go后台使用jwt,对API接口进行权限控制.此外,Web页 ...
- 一套基于SpringBoot+Vue+Shiro 前后端分离 开发的代码生成器
一.前言 最近花了一个月时间完成了一套基于Spring Boot+Vue+Shiro前后端分离的代码生成器,目前项目代码已基本完成 止步传统CRUD,进阶代码优化: 该项目可根据数据库字段动态生成 c ...
- vue+springboot前后端分离实现单点登录跨域问题处理
最近在做一个后台管理系统,前端是用时下火热的vue.js,后台是基于springboot的.因为后台系统没有登录功能,但是公司要求统一登录,登录认证统一使用.net项目组的认证系统.那就意味着做单点登 ...
- Flask & Vue 构建前后端分离的应用
Flask & Vue 构建前后端分离的应用 最近在使用 Flask 制作基于 HTML5 的桌面应用,前面写过<用 Python 构建 web 应用>,借助于完善的 Flask ...
- SpringBoot+Jpa+SpringSecurity+Redis+Vue的前后端分离开源系统
项目简介: eladmin基于 Spring Boot 2.1.0 . Jpa. Spring Security.redis.Vue的前后端分离的后台管理系统,项目采用分模块开发方式, 权限控制采用 ...
- 《论vue在前后端分离项目中的实践之年终总结》
我是2014年的时候开始了解知道的vue,当时vue还不太成熟,想用但是又怕自己hold不住,况且那时候vue还没有成熟的(路由.验证.ui组件)插件,社区也是不温不火的,再说也没有合适的机遇让我去项 ...
随机推荐
- js数组,字符转换;key_value获取
js 数组转字符串js 字符串转数组arr.join(",");String.split(","); 对象的所有keys Object.keys(val)对象的 ...
- MySQL硬核干货:从磁盘读取数据页到缓冲池时,免费链表有什么用?
1.数据库启动的时候,是如何初始化Buffer Pool的? 现在我们已经搞明白一件事儿了,那就是数据库的Buffer Pool到底长成个什么样,大家想必都是理解了 其实说白了,里面就是会包含很多个缓 ...
- vue表单选项框
选项框选的内容在下面显示 <!DOCTYPE html> <html lang="en"> <head> <meta charset=&q ...
- SQL基础教程(第2版)第3章 聚合与排序:3-2 对表进行分组
第3章 聚合与排序:3-2 对表进行分组 ● 使用GROUP BY子句可以像切蛋糕那样将表分割.通过使用聚合函数和GROUP BY子句,可以根据“商品种类”或者“登记日期”等将表分割后再进行汇总.● ...
- openlayers基础用例
http://weilin.me/ol3-primer/ch03/03-01.html#http://weilin.me/ol3-primer/ //地址http://openlayers.org/ ...
- jQuery如何给DOM添加ID
ID每个元素只能有一个,ID名同一页面也不能重复,addID方法是不需要的,和其他属性一样用attr方法就行了, $(singleTarget).attr('id','idName'); 更简单的 $ ...
- java依赖包问题排查
使用算法 breeze.optimize.LBFGSB,出现如下问题: 看到github上一个issue的解决方法是使用最新版本的 org.scalanlp:breeze_2.11:1.0-RC2, ...
- 01 语言基础+高级:1-8 File类与IO流_day08【 File类、递归】
day08[File类.递归] 主要内容 File类 递归 教学目标 能够说出File对象的创建方式 能够说出File类获取名称的方法名称 能够说出File类获取绝对路径的方法名称 能够说出File类 ...
- 记一次修复Windows
打开了一堆网页和应用,然后桌面不见了.. 于是很着急..就按各种快捷键..Win+R挂了.. 本来以为要reboot(机房电脑) , 然后问老师发现会格式化 然后发现Ctrl+Alt+Delete还存 ...
- 注册服务和发现服务 Eureka
来自蚂蚁课堂: 注册服务和发现服务 1.原理如图: 注册中心负载均衡: 实践 注册中心 集群: