使用node+express框架快速搭建本地运行的静态服务器

使用node+express框架快速搭建本地运行的静态服务器

1 将Vue项目使用npm run build命令构建静态文件,将导出的dist文件夹单独提取,放入Demo文件夹

2 进入Demo文件夹,使用shift加右键进入PowerShell命令窗口,准备搭建node环境

3 在命令窗输入yarn -y init,初始化文件夹,生成package.json文件,然后yarn add express,安装express框架

4 安装完成后,在Demo文件夹下新建app.js,编辑app.js

var express = require('express') // 引入express
var app = express() // 创建express实例化对象

app.use(express.static('./dist')) // 托管dist目录
app.listen(16996,function(){
    console.log('项目开始运行,请点击下方链接浏览项目\n\nhttp:127.0.0.1:13669')
})

5 编辑完成app.js文件后,可以直接在shell窗口中输入node app.js 运行app文件,至此,静态服务器搭建成功

6 还可以在加一步,建立start.bat文件,在文件里编辑node app.js,然后保存退出,以后想要运行项目时不必再打开shell窗口,可以直接双击start.bat文件运行项目

7 再补充一点,其实想要搭建静态服务器不要要这么麻烦,使用npm i -g serve命令,直接全局安装一个serve服务器就好了,以后想启动项目直接打开cmd窗口,输入serve命令就可以运行了