简单描述:代码开发完了,需要环境来运行测试。服务器上没有nginx,搞起搞起。
  1.  
    在Centos下,yum源不提供nginx的安装,可以通过切换yum源的方法获取安装。也可以通过直接下载安装包的方法,**以下命令均需root权限执行**:
  2.  
    首先安装必要的库(nginx 中gzip模块需要 zlib 库,rewrite模块需要 pcre 库,ssl 功能需要openssl库)。选定**/usr/local**为安装目录,以下具体版本号根据实际改变。
安装:
1.安装gcc gcc-c++(如新环境,未安装请先安装)
  $ yum install -y gcc gcc-c++
2.安装PCRE库
  1. $ cd /usr/local/
  2. $ wget http://jaist.dl.sourceforge.net/project/pcre/pcre/8.33/pcre-8.33.tar.gz
  3. $ tar -zxvf pcre-8.33.tar.gz
  4. $ cd pcre-8.33
  5. $ ./configure
  6. $ make && make install
  如报错:configure: error: You need a C++ compiler for C++ support
  解决:yum install -y gcc gcc-c++
3.安装SSL库
  1. $ cd /usr/local/
  2. $ wget http://www.openssl.org/source/openssl-1.0.1j.tar.gz
  3. $ tar -zxvf openssl-1.0.1j.tar.gz
  4. $ cd openssl-1.0.1j
  5. $ ./config
  6. $ make && make install
4.安装zlib库存
  1. $ cd /usr/local/
  2. $ wget http://zlib.net/zlib-1.2.11.tar.gz
  3. $ tar -zxvf zlib-1.2.11.tar.gz
  4. $ ./configure
  5. $ make && make install
5.安装nginx
  1. $ cd /usr/local/
  2. $ wget http://nginx.org/download/nginx-1.8.0.tar.gz
  3. $ tar -zxvf nginx-1.8.0.tar.gz
  4. $ cd nginx-1.8.0
  5. $ ./configure --user=nobody --group=nobody --prefix=/usr/local/nginx --with-http_stub_status_module --with-http_gzip_static_module --with-http_realip_module --with-http_sub_module --with-http_ssl_module
  注:--with-http_ssl_module:这个不加后面在nginx.conf配置ssl:on后,启动会报nginx: [emerg] unknown directive "ssl" in /opt/nginx/conf/nginx.conf 异常   如报错:./configure: error: SSL modules require the OpenSSL library.
  解决:yum -y install openssl openssl-devel (亲测可用)   如报错:./configure: error: the HTTP gzip module requires the zlib library
  解决:在–prefix后面接以下命令: --with-pcre=/usr/local/pcre-8.36 指的是pcre-8.36 的源码路径。--with-zlib=/usr/local/zlib-1.2.8 指的是zlib-1.2.8 的源码路径。(我没遇到这个错误)
  
  6. $ make && make install
至此安装完成
配置环境变量:
  1.vim /etc/profile
  2.按i进入编辑模式 在其中加入nginx的配置
    export NGINX_HOME=/usr/local/nginx
    export PATH=$PATH:$NGINX_HOME/sbin
  3.按esc回到命令模式 使用命令 :wq退出
  4.运行命令 source /etc/profile让配置文件生效
  5.执行命令nginx -v出现版本号则环境变量配置成功
启动测试:
  
$ cd /usr/local/nginx/sbin/
  $ ./nginx
打开浏览器访问此机器的 IP,如果浏览器出现 Welcome to nginx! 则表示 Nginx 已经安装并运行成功。
其他命令:
  
cd /usr/local/nginx/sbin/
  
./nginx 启动
 
 ./nginx -s stop 停止 相当于先查出nginx进程id再使用kill命令强制杀掉进程
  
./nginx -s quit 停止 相当于是待nginx进程处理任务完毕进行停止
  
./nginx -s reload 重启
  
ps aux|grep nginx 查看nginx进程
  pkill nginx 强制关闭 以上安装方法nginx的配置文件位于:/usr/local/nginx/conf/nginx.conf
Nginx配置文件常见结构的从外到内依次是「http」「server」「location」等等,缺省的继承关系是从外到内,也就是说内层块会自动获取外层块的值作为缺省值。
部署vue项目:
打包之前先把config下index.js中的host改成服务器的ip,其他的跨域配置的ip也要改成服务器的ip(如果后台也是部署在同一台服务器下)
在项目的根路径下,运行命令npm run build 会在根路径下生产dist文件夹,将其中的文件(一般是static文件夹和index.html)通过xftp工具传到 /usr/local/nginx/html下,千万不要把dist这个文件夹也放进去。
/usr/local/nginx/conf/下 修改配置文件nginx.conf 主要是配置端口 代理等信息
cd /usr/local/nginx/sbin/
./nginx
然后在本地浏览器访问服务器 host:port/ 即可 这篇文章绝大部分内容是从下面博客copy过来的,原文中的命令有几处小错误,一处是安装pcre的过程中版本号错误,一处是 ./config要换成./configure这个我忘记是哪个了,看原文的需要注意一下。
原文链接:https://www.cnblogs.com/jackyzm/p/9600738.html
相关连接:https://www.cnblogs.com/kaid/p/7640723.html




CentOS7 安装nginx部署vue项目的更多相关文章

  1. Centos7 使用nginx部署vue项目

    一.安装nginx #设置源 sudo rpm -Uvh http://nginx.org/packages/centos/7/noarch/RPMS/nginx-release-centos-7-0 ...

  2. nginx部署vue项目

    nginx是一个高性能的HTTP和反向代理服务器.因此常用来做静态资源服务器和后端的反向代理服务器.本文主要记录使用nginx去部署使用vue搭建的前端项目,项目基于vue官方的脚手架vue-cli构 ...

  3. Docker镜像+nginx 部署 vue 项目

    一.打包vue项目 在开发完的vue项目输入如下命名,打包生成dist文件夹 yarn build / npm run build 此时根目录会多出一个文件夹:dist文件夹,里面就是我们要发布的东西 ...

  4. Centos+Nginx部署Vue项目

    1.项目打包生成dist文件夹 在项目根目录下打开cmd窗口,输入命令 npm run build //生成dist文件夹 2.将dist文件夹上传到centos7 使用scp命令或者用远程连接工具将 ...

  5. nginx部署vue项目 解决方案

    给前端同事部署了web项目之后,访问发现除了index.html可以访问,其他的路径使用了“伪静态”.比如访问:http://localhost:8081/user/login,访问即报404错误,这 ...

  6. 关于nginx部署vue项目的两个问题

    首先我使用的是后端接口+前端vue的形式,这样就涉及到跨域的问题.我是这样配置的: server { listen 80; server_name www.liangyp.xyz;//访问网址 loc ...

  7. Nginx部署vue项目的配置

    . 官网下载 http://nginx.org/en/download.html 选择stable version nginx/Windows-1.14.1 pgp . 解压 然后配置环境变量,如果环 ...

  8. 在nginx上部署vue项目(history模式)--demo实列;

    在很早之前,我写了一篇 关于 在nginx上部署vue项目(history模式) 但是讲的都是理论,所以今天做个demo来实战下.有必要让大家更好的理解,我发现搜索这类似的问题还是挺多的,因此在写一篇 ...

  9. 在nginx上部署vue项目(history模式);

    在nginx上部署vue项目(history模式): vue-router 默认是hash模式,使用url的hash来模拟一个完整的url,当url改变的时候,页面不会重新加载.但是如果我们不想has ...

随机推荐

  1. el-table表头与内容右边框错位问题

    在用element写一个后台管理系统时遇到一个坑,el-table标签渲染出数据后表头th和内容会有错位,之前没有的 修改大小都没用 于是看百度搜索一波最终解决修改之前 虽然不大 但是别扭 在全局添加 ...

  2. Spring Boot 2.x基础教程:MyBatis的多数据源配置

    前两天,我们已经介绍了关于JdbcTemplate的多数据源配置以及Spring Data JPA的多数据源配置,接下来具体说说使用MyBatis时候的多数据源场景该如何配置. 添加多数据源的配置 先 ...

  3. 判断CString 字符串里面是否全部为数字

    //原理就是去除0-9的数字,判断去除数字后的字符串是否为空,如果为空,说明字符串全部都是为数字,否则得话,就不是. strOutTimeOnNum = strouttime.TrimLeft( _T ...

  4. lambda表达式与函数式(FunctionalInterface)接口

    一.lambda表达式 lambda表达式 Lambda 是一个匿名函数,我们可以把 Lambda 表达式理解为是一段可以传递的代码(将代码像数据一样进行传递).使用它可以写出更简洁.更 灵活的代码. ...

  5. CentOS 7 内核更新后删除旧内核(转载)

    CentOS 7 内核更新后删除旧内核 0.当前 # uname -sr Linux 3.10.0-123.20.1.el7.x86_64 1.搜索查询 # rpm -q kernel kernel- ...

  6. css3 自定义字体_使用@font-face方式实现个性化字体

    当我们在浏览一些网站时发现,里面含有一些十分个性的字体,这些字体并不是我们电脑上安装的字体.那么css是如何实现自定义字体的呢? 资源网站大全https://55wd.com 在css3中可以通过@f ...

  7. HDU - 5970 题解

    题目链接 HDU - 5970 分析 很显然\(f(x,y)\)与\(f(x+y*k,y)\)的结果相同,因为它们在第一次取模后会变成相同的式子 我们再看一下数据的范围,突破口肯定在\(m\)那里 那 ...

  8. Aspose下载图片

    /// <summary> /// 把DataTable数据按照Excel模板导出到Excel /// </summary> /// <param name=" ...

  9. scrapy shell 的使用

    是什么?:是一个终端下的调试工具,用来调试scrapy 安装ipython :pip install ipython 启动: scrapy shell + 需要请求的url 进来之后,response ...

  10. 数据可视化之powerBI技巧(三)这个Power BI技巧很可爱:利用DAX制作时钟

    周末放松一下,给大家分享一个小技巧,仅利用DAX制作一个简易的时钟. 时钟效果如下: 这个时钟的制作只需一个度量值,你信吗? 事实上确实如此,制作步骤介绍如下: 1,新建参数,生成一个数字序列作为小时 ...