第一步：
文件夹以英文命名：
右键
进入 控制台后 npm init 回车 创建 package.json文件
然后 我们需要一个框架 express框架
下载这个框架
npm install eapress --save
然后 再编写一个js文件 <app.js>
let express=require("express")
let app=express()
let fs= require("fs")
// 让www文件为静态文件
app.use(express.static("www"))
// 配置一个借口
app.get("/yingshi",function(req,res){ 通过127.0.0.1:3000/yingshi端口打开 我们请求数据时也要通过他来请求
fs.readFile("./www/index.html",(err,data)=>res.end(data))
这个是我们的目录 我们 需要创建一个www的根目录 然后创建index.html 里面写上 我们的东西 比如 后台管理系统})
app.listen(3000)
console.log("已经打开了")
接下来运行 运行我们的js文件 node.app.js
然后打开后就会有一个后台管理系统
接着就可以尽情的写了
也可以写json文件 等等 。只要是 能够 通过 127.0.0.1.3000端口访问 到的 。
然后 重点 我们 需要改 vue脚手架 里config 下面的index.js文件
dev: {
// Paths
assetsSubDirectory: 'static',
assetsPublicPath: '/',
proxyTable: {
'/api': {
target: 'http://127.0.0.1:3000/', // target表示代理的服务器url
changeOrigin:true,
pathRewrite: { // pathRewrite表示路径重写，key表示一个正则，value表示别名
'^/api': '' // 即用 '/api'表示'http://localhost:3000/api'
}
}
},
需要在proxytable添加。
然后通过/api /api'表示'http://localhost:3000/api 他就表示我们的端口 就可以访问到 然后就可以 用 127.0.0.1:3000访问到的数据
通过axios请求 数据
下面的 只是参考 具体的还请去官方查看。
created(){
this.getList();
},
methods:{
getList(){
axios.get("/api/yingshi").then((res)=>{
// console.log(res.data)
this.arrs=res.data.links,
this.value=res.data.boble
this.roulowis=res.data.roulowis
}).catch((err)=>console.log(err))
},
},
}