美文网首页
如何在windows下使用Nginx配置前端项目

如何在windows下使用Nginx配置前端项目

作者: 深lin人不知 | 来源:发表于2019-10-23 09:09 被阅读0次

        最近要接手一个新的项目,拿到文件后打开项目的一瞬间,我的脑壳是晕的,那个目录结构。。。嗯,跟我写过的和见过的太不一样了,文件名都是拼音首字母缩写,反正我是猜不出来。。。 而且项目还需要用nginx启动,我都没用过这个东西。。。

  太难了,我真是太难了 后来在上一个负责人的远程指导+自己上网找方法+自己领悟+。。。反正各方面的作用下,终于给打开了

  第一次使用nginx打开前端项目,比较鸡冻,写篇文章纪念下,哦。。。是记录下

   

1.下载nginx安装包

  打开官网 http://nginx.org/ 点击download

   

  或者直接打开http://nginx.org/en/download.html也行

  Stable version是稳定版,选择Stable version下面的window版本

   

  下载后解压,根目录为nginx-1.16.1(解压之后默认的文件夹名,没改,我懒。。。)

   

2.启动ngnix项目

  不要直接双击nginx.exe,不要问为什么,我也不知道,从网上看到别人说的,当然我也没试过。。。

  在该文件夹(nginx-1.16.1)下执行 start nginx, 即可启动nginx

  打开127.0.0.1,即可看到

       

  注意:执行 start nginx后页面有时候会闪一下,这个是正常的,如果不确定是否成功启动,可以在任务管理器中查看有没有nginx.exe

  如果有的话,则代表启动成功,就像下面的这样

       

3.查看项目是否启动成功

  如果没有,那执行下面的这个命令看看 tasklist /fi "imagename eq nginx.exe"

  执行后有截图中的内容也说明启动成功了

       

  如果执行后是这个亚子

       

   那就说明没有项目启动,看看是不是关掉了还是报错了

4.重新载入配置

  如果中间需要更新了conf/nginx.conf文件,需要刷新页面,那就先执行一下重新载入配置文件命令 .\nginx -s reload  再刷新页面就好了

5.停止nginx服务

  会启动服务,会重新载入了,那怎么停止服务呢,只要执行  .\nginx -s quit  就可以了。

  以上是我在网上搜到并修改后可以正常使用的方法,下面说一下我在项目中遇到的问题。

  前端使用Nginx打开页面其实用nginx进行了一个目录转发,所以地址路径什么的一定要配置好,我是接手的项目,里面有配置好的nginx.conf文件,至于具体咋配置,不好意思,我是真的不会。。。自己琢磨琢磨哈

  把项目里面的文件放进 打开nginx-1.16.1/conf/ 把nginx-1.16.1/conf/中的nginx.conf,替换为项目中的nginx.conf 打开nginx-1.16.1/conf/nginx.conf,看看里面root 对应的地址找不找得到,如果找不到,那就动动小手改一下啦

  执行 start nginx

  如果已经启动过了,那就执行.\nginx -s reload

  打开对应链接,就能看到页面了,

  打开链接的时候注意端口号,

       

  像我这个项目的是8080,对应的 打开http://localhost:8080就能看到熟悉的 Welcome to nginx! 了

       

        然后拼上正确的页面路径就可以了

  具体页面就要看你们的页面路径是啥了,如果没出来,那就去nginx-1.16.1/logs/error.log看报错信息,对应的修改一下就好了

总结一下使用到的命令

  启动: start nginx

  重新载入配置文件: .\nginx -s reload

  退出: .\nginx -s quit

  检查是否有运行中的nginx: tasklist /fi "imagename eq nginx.exe"

好了,就这么多

相关文章

  • 如何在windows下使用Nginx配置前端项目

    最近要接手一个新的项目,拿到文件后打开项目的一瞬间,我的脑壳是晕的,那个目录结构。。。嗯,跟我写过的和见过...

  • angular2 构建项目并配置反向代理

    部署前端angular项目时遇到的问题有以下: 使用nginx 配置反向代理 使用nginx配置负载均衡 使用ng...

  • Nginx部署前端应用

    Nginx 部署前端应用挺普遍的,本文为演示快速启动项目,其它配置后续再添加。使用的版本windows-1.17....

  • nginx tomcat 搭建web

    本文实验环境在windows下,旨在快速掌握nginx基本使用配置 1启动nginx 进入nginx 目录: 配置...

  • windows 下运行npm 配置环境变量

    前端运行 项目时: package.json中的配置: linux、Mac 下配置 windows 下配置 如果...

  • 如何搭建一个比较省心的前端开发环境

    根据 《windows下使用Yeoman快速构建web项目(当前web富前端开发最全环境配置)》整理所得。 1、安...

  • JIR学习

    概述:如何在JIRA上创建新项目或配置已有的项目。 JIRA使用教程:在Windows上安装JIRA JIRA使用...

  • Vue-cli项目部署到Nginx

    项目环境:nginx/1.16.1,vue-cli/3.11.0 0. Nginx使用 以windows版为例,下...

  • ngnix的简单配置

    ngnix配置代理接口 通过上面的配置就可以实现后端代理接口,前端静态资源的访问 windows下启动停止Nginx服务

  • nginx使用

    Nginx在windows下的安装、运行,以及配置文件讲解 安装Nginx(windows版) 进入Nginx官网...

网友评论

      本文标题:如何在windows下使用Nginx配置前端项目

      本文链接:https://www.haomeiwen.com/subject/dndhvctx.html