第一步：
文件夾以英文命名：
右鍵
進入 控制台后 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))
},
},
}