[JavaScript知识库]node处理Vuerouter路由history模式刷新404页面

node处理Vuerouter路由history模式刷新404页面

1. 肯定要有npm 和 node环境 如果没有自行百度

2. 新建一个node项目 然后命令行npm init初始化

3. 安装express框架 npm i express

4. 安装npm install --save connect-history-api-fallback(核心) npm地址：https://www.npmjs.com/package/connect-history-api-fallback

5. 在vue项目中npm run build生成的dist目录拷贝到node文件夹中

6. 在node文件夹中新建index.js,代码和注释如下

   const express  = require('express')//引入express框架
   const history = require('connect-history-api-fallback')  //引入核心库，专门用来处理history api的
   
   const app = express()   
   app.use(history())
   app.use(express.static(__dirname+'/dist'))   //设置静态资源目录  node文件名下的dist目录  
   
   app.listen(9090,(err)=>{  //开启9090端口
       if(!err){
           console.log('服务器已启动')
       }
   })
   
   

7. 在终端中node index,启动服务器

8. 浏览器输入localhost:9090,刷新页面不在出现404了

9. 完结，撒花