Vuecli3.x与Node.js项目配置前后端连载

全栈开发过程中,前后端分别采用vue-cli脚手架和Node.js开发。项目启动时,分别在两个终端中启动Node.js后台项目,再在另一个终端中启动vue项目,这样做会比较麻烦,因此就需要前后端连载。

项目根目录下除了client是前端部分,其余为Node后端部分。两个都有一个package,json文件

下面是前后端连载的方式:

1.安装concurrently模块

一定是在项目根目录下执行安装模块命令:

cnpm install concurrently

2.配置client中的package.json:

 "scripts": {
    "serve": "vue-cli-service serve",
    "build": "vue-cli-service build",
    "start": "npm run serve"
  },

3.配置项目根目录下的package.json:

 "scripts": {
    "client-install": "npm install --prefix client",
    "client": "npm start --prefix client",
    "start": "node server.js",
    "server": "nodemon server.js",
    "dev": "concurrently \"npm run server\" \"npm run client\""
  },

4.启动项目:

切换到项目根目录下,执行命令:npm run dev

这样就是项目前后端连载成功:

但是我在第一次连载启动项目时报错某个模块找不到,于是将项目根目录下的node_modules删除后,重新安装(npm install)

然后启动完成。

 

评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值