Vue项目上线相关配置 使用node创建web服务器

Vue项目上线相关配置 使用node创建web服务器

1. 通过node创建web服务器

1. 新建文件夹 vue_shop_server，VS Code打开文件夹
2. npm init -y 初始化包管理文件
3. npm install express -S 安装Express
4. 将vue_shop文件夹中的dist目录复制到vue_shop_server中
5. 在vue_shop_server根目录下新建入口文件app.js
6. 运行命令node .\app.js
7. 启动成功后，在浏览器地址栏输入127.0.0.1，即可浏览页面

目录结构：

// app.js
const express = require('express')
const app = express()

// 托管静态目录
app.use(express.static('./dist'))

app.listen(80, () => {
  console.log("server running at http://127.0.0.1");
})

2. 开启gzip配置

使用gzip可以减小文件体积，使传输速度更快。

1. npm install compression -S 安装
2. 在app.js中配置

const express = require('express')
const compression = require('compression')
const app = express()

// 注册中间件，一定要写在静态托管目录前，否则gzip不会生效
app.use(compression())
// 托管静态目录
app.use(express.static('./dist'))

app.listen(80, () => {
  console.log("server running at http://127.0.0.1");
})