vue-cli加载不到dev-server.js的解决办法

venmos 发布于2019-08-21 17:45 / 1896人阅读

摘要：首先在后添加开发框架，用来简化操作创建的开发框架的实例引用的地址某一个请求配置在选项中添加以下内容这里是你的内容注意修改配置文件完毕后，需要重新运行命令即可。

在使用vue开发过程中，难免需要去本地数据地址进行请求，而原版配置在dev-server.js中，新版vue-webpack-template已经删除dev-server.js，改用webpack.dev.conf.js代替，所以配置本地访问在webpack.dev.conf.js里配置即可。

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

// nodejs开发框架express，用来简化操作
const express = require("express")
// 创建node.js的express开发框架的实例
const app = express() 
// 引用的json地址
var appData = require("../data.json")
// json某一个key
var goods = appData.result

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

1. get请求配置

#webpack.dev.conf.js
// 在devServer选项中添加以下内容
before(app) {
  app.get("/api/someApi", (req, res) => {
    res.json({
      // 这里是你的json内容
    })
  })
}

注意：修改配置文件完毕后，需要重新运行命令npm run dev即可。

2. post请求配置。

如果要配置post请求，需要在该文件夹配置如下:

#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)
 })
}

GPU云服务器云服务器的解决办法微软的解决办法 use的解决办法换ip的解决办法

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/89966.html

vue-cli 项目结构

摘要：项目结构为我们搭建开发所需要的环境目录结构及主要功能项目构建相关代码生产环境构建代码检查等版本热重载相关构建本地服务器构建工具相关基础配置开发环境配置生产环境配置项目开发环境配置开发环境 Vue-cli 项目结构 vue-cli 为我们搭建开发所需要的环境目录结构及主要功能 |-- build // 项目构建(webpack)...

int64 2019-08-21 17:40 评论0 收藏0
vue-cli 项目结构

摘要：项目结构为我们搭建开发所需要的环境目录结构及主要功能项目构建相关代码生产环境构建代码检查等版本热重载相关构建本地服务器构建工具相关基础配置开发环境配置生产环境配置项目开发环境配置开发环境 Vue-cli 项目结构 vue-cli 为我们搭建开发所需要的环境目录结构及主要功能 |-- build // 项目构建(webpack)...

Markxu 2019-08-01 18:00 评论0 收藏0
vue-cli 项目结构

摘要：项目结构为我们搭建开发所需要的环境目录结构及主要功能项目构建相关代码生产环境构建代码检查等版本热重载相关构建本地服务器构建工具相关基础配置开发环境配置生产环境配置项目开发环境配置开发环境 Vue-cli 项目结构 vue-cli 为我们搭建开发所需要的环境目录结构及主要功能 |-- build // 项目构建(webpack)...

trilever 2019-08-29 13:49 评论0 收藏0
webpack开发与生产环境配置

摘要：豹哥对于刚开始小白的自己虽然现在也白知无不谈，而且回复超快超认真。这里真的很感谢豹哥。是项目启动时的一些文件，如的配置文件开发环境服务配置文件一些简单工具函数等等。是关于整个项目的环境配置包括开发与生产。前言作者去年就开始使用webpack, 最早的接触就来自于vue-cli。那个时候工作重点主要也是 vue 的使用，对webpack的配置是知之甚少，期间有问题也是询问大牛 @吕大...

afishhhhh 2019-08-20 18:32 评论0 收藏0
vue学习笔记（四）

摘要：提供了两种向组件传递参数的方式。子路由项路径不要使用开头，以开头的嵌套路径会被当作根路径。路由实例的方法这里学习两个路由实例的方法和。实际上，是通过不同的将这些资源加载后打包，然后输出打包后文件。一、vue-router 1、简介我们经常使用vue开发单页面应用程序（SPA）。在开发SPA过程中，路由是必不可少的部分，vue的官方推荐是vue-router。单页面应用程序看起来好像...

frank_fun 2019-08-21 17:16 评论0 收藏0