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访问

阅读剩余
THE END