vue-cli加載不到dev-server.js的解決辦法

venmos 發(fā)布于2019-08-21 17:45 / 1955人閱讀

摘要：首先在后添加開發(fā)框架，用來簡化操作創(chuàng)建的開發(fā)框架的實(shí)例引用的地址某一個(gè)請(qǐng)求配置在選項(xiàng)中添加以下內(nèi)容這里是你的內(nèi)容注意修改配置文件完畢后，需要重新運(yùn)行命令即可。

在使用vue開發(fā)過程中，難免需要去本地?cái)?shù)據(jù)地址進(jìn)行請(qǐng)求，而原版配置在dev-server.js中，新版vue-webpack-template已經(jīng)刪除dev-server.js，改用webpack.dev.conf.js代替，所以配置本地訪問在webpack.dev.conf.js里配置即可。

#webpack.dev.conf.js
// 首先在const portfinder = require("portfinder")后添加

// nodejs開發(fā)框架express，用來簡化操作
const express = require("express")
// 創(chuàng)建node.js的express開發(fā)框架的實(shí)例
const app = express() 
// 引用的json地址
var appData = require("../data.json")
// json某一個(gè)key
var goods = appData.result

var apiRoutes = express.Router()
app.use("/api", apiRoutes)

1. get請(qǐng)求配置

#webpack.dev.conf.js
// 在devServer選項(xiàng)中添加以下內(nèi)容
before(app) {
  app.get("/api/someApi", (req, res) => {
    res.json({
      // 這里是你的json內(nèi)容
    })
  })
}

注意：修改配置文件完畢后，需要重新運(yùn)行命令npm run dev即可。

2. post請(qǐng)求配置。

如果要配置post請(qǐng)求，需要在該文件夾配置如下:

#webpack.dev.conf.js
apiRoutes.post("/foods", function (req, res) { //注意這里改為post就可以了
  res.json({
    error: 0,
    data: foods
  });
})
// 在組件里面
#...vue
created () {
 this.$http.post("http://localhost:8080/api/foods").then((res) => {
  console.log(res)
 })
}

云服務(wù)器 GPU云服務(wù)器的解決辦法微軟的解決辦法 use的解決辦法換ip的解決辦法

文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請(qǐng)注明本文地址：http://www.ezyhdfw.cn/yun/89966.html

相關(guān)文章

vue-cli 項(xiàng)目結(jié)構(gòu)

摘要：項(xiàng)目結(jié)構(gòu)為我們搭建開發(fā)所需要的環(huán)境目錄結(jié)構(gòu)及主要功能項(xiàng)目構(gòu)建相關(guān)代碼生產(chǎn)環(huán)境構(gòu)建代碼檢查等版本熱重載相關(guān)構(gòu)建本地服務(wù)器構(gòu)建工具相關(guān)基礎(chǔ)配置開發(fā)環(huán)境配置生產(chǎn)環(huán)境配置項(xiàng)目開發(fā)環(huán)境配置開發(fā)環(huán)境 Vue-cli 項(xiàng)目結(jié)構(gòu) vue-cli 為我們搭建開發(fā)所需要的環(huán)境目錄結(jié)構(gòu)及主要功能 |-- build // 項(xiàng)目構(gòu)建(webpack)...

int64 2019-08-21 17:40 評(píng)論0 收藏0
vue-cli 項(xiàng)目結(jié)構(gòu)

摘要：項(xiàng)目結(jié)構(gòu)為我們搭建開發(fā)所需要的環(huán)境目錄結(jié)構(gòu)及主要功能項(xiàng)目構(gòu)建相關(guān)代碼生產(chǎn)環(huán)境構(gòu)建代碼檢查等版本熱重載相關(guān)構(gòu)建本地服務(wù)器構(gòu)建工具相關(guān)基礎(chǔ)配置開發(fā)環(huán)境配置生產(chǎn)環(huán)境配置項(xiàng)目開發(fā)環(huán)境配置開發(fā)環(huán)境 Vue-cli 項(xiàng)目結(jié)構(gòu) vue-cli 為我們搭建開發(fā)所需要的環(huán)境目錄結(jié)構(gòu)及主要功能 |-- build // 項(xiàng)目構(gòu)建(webpack)...

Markxu 2019-08-01 18:00 評(píng)論0 收藏0
vue-cli 項(xiàng)目結(jié)構(gòu)

摘要：項(xiàng)目結(jié)構(gòu)為我們搭建開發(fā)所需要的環(huán)境目錄結(jié)構(gòu)及主要功能項(xiàng)目構(gòu)建相關(guān)代碼生產(chǎn)環(huán)境構(gòu)建代碼檢查等版本熱重載相關(guān)構(gòu)建本地服務(wù)器構(gòu)建工具相關(guān)基礎(chǔ)配置開發(fā)環(huán)境配置生產(chǎn)環(huán)境配置項(xiàng)目開發(fā)環(huán)境配置開發(fā)環(huán)境 Vue-cli 項(xiàng)目結(jié)構(gòu) vue-cli 為我們搭建開發(fā)所需要的環(huán)境目錄結(jié)構(gòu)及主要功能 |-- build // 項(xiàng)目構(gòu)建(webpack)...

trilever 2019-08-29 13:49 評(píng)論0 收藏0
webpack開發(fā)與生產(chǎn)環(huán)境配置

摘要：豹哥對(duì)于剛開始小白的自己雖然現(xiàn)在也白知無不談，而且回復(fù)超快超認(rèn)真。這里真的很感謝豹哥。是項(xiàng)目啟動(dòng)時(shí)的一些文件，如的配置文件開發(fā)環(huán)境服務(wù)配置文件一些簡單工具函數(shù)等等。是關(guān)于整個(gè)項(xiàng)目的環(huán)境配置包括開發(fā)與生產(chǎn)。前言作者去年就開始使用webpack, 最早的接觸就來自于vue-cli。那個(gè)時(shí)候工作重點(diǎn)主要也是 vue 的使用，對(duì)webpack的配置是知之甚少，期間有問題也是詢問大牛 @呂大...

afishhhhh 2019-08-20 18:32 評(píng)論0 收藏0
vue學(xué)習(xí)筆記（四）

摘要：提供了兩種向組件傳遞參數(shù)的方式。子路由項(xiàng)路徑不要使用開頭，以開頭的嵌套路徑會(huì)被當(dāng)作根路徑。路由實(shí)例的方法這里學(xué)習(xí)兩個(gè)路由實(shí)例的方法和。實(shí)際上，是通過不同的將這些資源加載后打包，然后輸出打包后文件。一、vue-router 1、簡介我們經(jīng)常使用vue開發(fā)單頁面應(yīng)用程序（SPA）。在開發(fā)SPA過程中，路由是必不可少的部分，vue的官方推薦是vue-router。單頁面應(yīng)用程序看起來好像...

frank_fun 2019-08-21 17:16 評(píng)論0 收藏0