【React】如何使用npm run start命令运行两个服务

我们开发前端项目时,有时候需要本地 mock 数据,这样就需要启动两个服务,一个是接口服务,一个是前端项目。可以安装一个插件来帮助我们通过一个命令启动两个服务。

方法一

添加& npm run server

注意:Windows系统不可行

方法二:Windows系统可行的办法

1、安装 concurrently 插件

javascript 复制代码
npm install concurrently -D 

2、配置 npm 命令

在 package.json 中配置 start 命令:

javascript 复制代码
"scripts": {
    "serve": "craco start",
    "build": "craco build",
    "test": "react-scripts test",
    "eject": "react-scripts eject",
    "server": "json-server ./server/data.json --port 8888",
    "start": "concurrently \"npm run serve\" \"npm run server\""
  },

参考博文

文档一
文档二
文档三

相关推荐
恋猫de小郭3 小时前
Flutter 开发怎么做 Agent ?从工程实战详细给你解读下
android·前端·flutter
IT_陈寒3 小时前
React状态更新延迟搞晕我,原来是闭包在捣鬼
前端·人工智能·后端
晓得迷路了3 小时前
栗子前端技术周刊第 136 期 - pnpr、Flow 重构移植 Rust、Astryx...
前端·javascript·css
binbin_523 小时前
React Native 鸿蒙环境搭建完整实战:从 RN 工程到 RNOH 运行
深度学习·react native·react.js·harmonyos
柳杉3 小时前
别再手写大屏了!用这套「3D 地图 + 拖拽脚手架」示例源码,交付效率提升 80%
前端·three.js·数据可视化
乌夷3 小时前
Vue.js 3 的设计思路
前端·javascript·vue.js
星云_byto3 小时前
五分钟从零配置好VSCode + Claude Code + DeepSeek V4 Pro
ide·vscode·编辑器·cursor·codex·claude code·deepseekv4
丨我是张先生丨4 小时前
英语单词 Web Page
前端·css·css3
kgduu4 小时前
react-redux学习笔记
笔记·学习·react.js
随风一样自由4 小时前
【前端+Vitest测试框架】Vitest | Playwright | WebdriverIO | Preview
前端·前端框架·可用性测试