Vue中使用Mock，devSever中before方法弃用>webpack新版本出现的vue.config.js配置问题：options has an unknown property �

话不多说直接上代码：

1、mock相关配置（mock/index.js），这里仅使用 setupMiddlewares 其余旧版级过渡版本方法见官网

 1   // 引入mock
 2   const Mock = require('mockjs');
 3   // 数据生成
 4   var data = Mock.mock({
 5       id: '@id',
 6       username: '@cname',
 7   })
 8   
 9   module.exports = function (middlewares, devServer) {
10      if (!devServer) throw new Error("webpack-dev-server is not defined");
11 　　　　//env文件自行配置吧，不做介绍了 
12      if (process.env.MOCK == 'true') {
13          /*如果你想在所有其他中间件之前运行一个中间件或者当你从 `onBeforeSetupMiddleware` 配置项迁移时，可以使用 `unshift` 方法*/
14          middlewares.unshift({
15              name: 'unshift7',
16              path: '/unshift7',
17              middleware: (req, res) => {
18                  res.json('unshift测试')
19              }
20          });
21          // 测试导出mock假数据
22          devServer.app.post('/gaga', (_, response) => {
23              response.json(data);
24          });
25  
26          /* 如果你想在所有其他中间件之后运行一个中间件或者当你从 `onAfterSetupMiddleware` 配置项迁移时，可以使用 `push` 方法*/
27          middlewares.push({
28              name: 'push7',
29              path: '/push7',
30              middleware: (req, res) => {
31                  res.json('push测试')
32              }
33            });
34    
35            return middlewares;
36      }
37  }

2、vue.config.js中配置

1  const { defineConfig } = require('@vue/cli-service')
2  module.exports = defineConfig({
3      transpileDependencies: true,
4      devServer: {
5 　　　　　　//这里将原旧版本的before修改一下最新推荐方法即可
6          setupMiddlewares:require('./mock/index')
7      }
8 })
9 //webpack4.7+版本建好后的基础代码

3、vue文件中发起请求(别忘记axios配置)

 1  <template>
 2       <div>
 3           1234567
 4       </div>
 5   </template>
 6   
 7   <script>
 8   import axios from 'axios';
 9   export default {
10      name: 'HelloWorld',
11      created(){
12          axios.get('/unshift7').then(res=>{
13              console.log(res);
14          })
15          axios.post('/gaga').then(res=>{
16              console.log(res);
17          })
18          axios.post('/push7').then(res=>{
19              console.log(res);
20          })
21      }
22  }
23  </script>

结果：

如有错误请指正，谢谢~~~ 

详细配置请参照：（官网：https://www.webpackjs.com/configuration/dev-server#devserversetupmiddlewares）