Vue 搭建部署迷你服务器和打包上线项目

本文最后更新于2022.05.29-12:14，某些文章具有时效性，若有错误或已失效，请在下方留言或联系涛哥。

一，搭建迷你服务器

1，创建一个文件夹为mini_server

2, win+r打开cmd命令，

cd mini_server路径

3，加载npm

npm init package name mini_server

4，安装express

npm i express

 5，安装路由的history

npm i connect-history-api-fallback

 6，在mini_server文件下创建一个server.js文件完成以下配置

server.js

// npm init
// package name mini_server
// npm i express
// npm i connect-history-api-fallback
//微型服务配置
const express = require('express');
const history = require('connect-history-api-fallback');
​
//创建应用
const app = express();
​
//修复history把路由当请求接口的异常
app.use(history());
//应用指向到文件夹
app.use(express.static(__dirname+'/static'));
​
//启动
app.listen(80,(err)=>{
    if(!err){
        console.log("服务器启动成功");
    }
})

7，在vs-code工具里输入以下命令

二，部署项目到服务器

1，将要部署的项目打包成dist文件将里面的static和index.html文件拷贝到mini_server 的static文件下

2，打开服务器

3，启动服务器

4，通过公网ip访问