windows下nginx的安装，使用及vue工程的部署

nginx的安装与使用

nginx的安装

windows系统下nginx的安装非常简单，在nginx官网下载windows版本的nginx，解压即可。

解压后目录如下：

nginx的使用：

打开命令行，进入nginx所在目录

cd D:\nginx-1.18.0

执行相应语句：

启动nginx：start nginx

强制停止： nginx -s stop

正常停止： nginx -s quit

配置文件修改重装载： nginx -s reload

 

vue工程的部署

要将vue工程部署在nginx服务器上，首先需要打包。我使用的是vue-cli脚手架（默认是这个），打包方式为命令行进入项目文件夹

cd D:\web\test1

输入命令打包文件

npm run build

打包完成后，项目中会出现一个dist的文件夹，此时说明打包成功了

 

将dist文件夹移动到nginx文件夹下的html文件夹（你在nginx下自己创建一个文件夹也可以），修改nginx\conf文件夹下nginx.conf文件，修改内容如下面红色部分

 server {
        listen       80;
        server_name  localhost;

        location / {
                     root html\dist;
                     index index.html index.htm;
        }

这里的root是相对路径，写自己的dist所在相对路径即可。用绝对路径也是可以的。

设置完成后，重启nginx

nginx -s reload

打开localhost:80即可