vue-cli没有dev-server.js文件该怎么办

本文介绍了在Vue更新后如何配置本地数据访问。新版中移除了dev-server.js,相关配置被整合进webpack.dev.conf.js。文章详细展示了如何在新文件中进行配置,以实现与旧版相同的功能。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

原有

原来的vue-clivue init webpack 文件名之后,在build目录下会生成dev-server.js文件,可以在页面请求本地数据的时候使用。但是最新版本的vue中,并没有找到这两个文件。应该怎么处理呢?

解决

虽然 dev-server.js 文件没有了,替换到了webpack.dev.conf.js 文件里面。我们可以在webpack.dev.conf.js里面做相同的事

步骤

旧版dev-server.js配置本地数据访问:

在const app = express()后,const compiler = webpack(webpackConfig)前配置就可以

var appData = require('../data.json')
var seller = appData.seller
var goods = appData.goods
var ratings = appData.ratings
var foods = appData.foods
var pice = appData.pice
var apiRoutes = express.Router()

apiRoutes.post('/test', function (req, res) {
  res.json({
    errno: 0,
    data:test
  });
})
app.use('/api',apiRoutes)

在新的文件中

在const portfinder = require(‘portfinder’)后添加

//首先
const express = require('express')
const app = express()
var apiRoutes = express.Router()
app.use('/api', apiRoutes)

找到devServer,在里面添加
before(app) {
  app.get('/api/test', (req, res) => {
    res.json({
      errno: 0,
      data: test
    })
  }),
}

就可以了

这里写图片描述

就像这样子

注意

修改之后必须npm run dev才管用 注意哦

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值