1.将代码打包 npm run build

2.安装nodejs与nginx

Nginx是一款轻量级服务器/反向代理服务器及电子邮件（IMAP/POP3）代理服务器，其特点是占有内存少，并发能力强，事实上nginx的并发能力在同类型的网页服务器中表现较好，中国大陆使用nginx网站用户有：百度、京东、新浪、网易、腾讯、淘宝等。

3.项目代码部署-部署就是把你代码放到服务器运行

a. 将打包好的vue代码上传到Nginx默认的站点下，目录地址为/usr/share/nginx/html

b. 启动node服务端为项目提供数据访问服务 上传node服务端的代码到远程服务器，位置可以随意（因为代码是node运行的，不是nginx）：并开启node服务

c. 解决nginx下，路由模式history失效的问题

方案1：不使用`history`模式的路由：用hash模式，该模式下地址栏会有`#`

方案2：配置nginx，让nginx支持`history`模式的路由

location / {
    root   /usr/share/nginx/html;
    index  index.html index.htm;
    # 以下是新增的一行
    try_files $uri $uri/ /index.html;
}

重启之后新的配置将会生效，项目到这里也就可以通过域名或者ip地址进行访问了。

    server {
        listen       8000;
        server_name  localhost;
 
        # 文件路径
        location / {
			try_files $uri $uri/ @router;
            root   D:\study\admin-vue\dist;
            index  index.html index.htm;
        }
		
        # 后端服务器
		location /api {
		   proxy_set_header   Cookie $http_cookie;
		   proxy_pass  http://api_212121;
		   proxy_redirect ~^http://api_212121(.*) http://api_212121$1;
		}
		
        # vue 在history 模式下的配置
		location @router {
           rewrite ^.*$ /index.html last;
        }
		
    }

总体来说就是打包、配置nginx、启动nginx

理解部署:
前端代码的部署：没有服务，依赖后台服务，不需要重启，只要将新代码放对位置就好，所谓的前端部署可以理解放到服务器对应的位置。
后台代码的部署：后台打包后，生成新的压缩包，需要重启服务，后台部署中包含启动服务。
综上：前后端代码部署其实过程不一样。
至于，前端工程上的热更新，不涉及到，因为走的是npm run build，而不是npm run dev，也就没有热更新。
前后端分离工程，前端代码打包后的代码都放到的nginx统一的服务器地址上。
前后端一体工程，前后端分别进行打包，把前端打包后的代码放到后台文件夹的对应位置，并把后台打包的压缩包放到每个工程的服务器上，并启动服务。所以整个过程复杂耗时。

将开发完成的项目打包上线（本地服务器示例）

1.在与该项目同级目录下新建一个该项目的 server 文件夹，在 VS Code 中打开这个空文件夹，使用 “Ctrl + ` ”打开终端，输入 npm init -y 将项目自动初始化，然后运行 npm i express -S 为项目安装 express 服务器组件；

npm init -y
npm i express -S

2.然后将需上线项目中的 dist 文件整个复制一份到 server 文件夹的根目录中；

3.在打包项目即 server 项目的根目录下新建一个 app.js 文件，作为此 server 文件的入口文件。app.js 文件中的代码示例如下：

// 导入 express 模块
const express = require('express')
 
// 创建 express 服务器实例
const app = express()
 
// 托管静态资源
app.use(express.static('./dist'))
 
// 调用 app.listen() 方法，指定端口号并启动服务器
app.listen(80, () => {
    console.log('server running at http://127.0.0.1');
})

4.最后在终端中运行 node .\app.js 命令，运行成功后我们的项目就成功在本地服务器上进行上线了，我们即可通过http://127.0.0.1 访问该项目。