当前位置: 首页 > news >正文

一分钟理解npm run dev 和 npm run serve

        前端开发过程中运行Vue项目的时候,有时候使用npm run serve命令可以启动项目,有时候却会报错;有时候使用npm run dev命令可以启动项目,有时候却也会报错。是什么原因造成这种情况呢,原因在于Vue脚手架版本的问题,也可以理解为执行配置的脚本问题,有的脚手架版本支持npm run serve命令启动项目,有的脚手架版本却支持npm run dev命令启动项目。
        npm run dev     是vue-cli2.0版本使用的
        npm run serve  是vue-cli3.0版本使用的

vue-cli2.0: 

"scripts": {"dev": "webpack-dev-server --inline --progress --config build/webpack.dev.conf.js","start": "npm run dev","build": "node build/build.js"
}

 vue-cli3.0:

  "scripts": {"serve": "vue-cli-service serve","build": "vue-cli-service build","lint": "vue-cli-service lint"}

可以把这个 npm run serve 当做是 npm run package.json 里面的scripts的value。
比如,npm run serve 实际运行的是 vue-cli-service serve;而如果你想使用npm run dev 的话,只需把 “serve” 修改为 “dev” 就行。

npm run xxx 中的 xxx 可以理解为键值对的 key,实际上 run 的是在 package.json 里面 scripts 配置的 value;

比如,npm run serve 实际运行的是 vue-cli-service serve;

而放在 3.0 以前运行的则是 node build/dev-server.js 文件;

小结
        npm run xxx,并不是你想运行就运行的,只有在 package.json脚本中对scripts 配置了,才可以进行 run 的,所以不是所有的项目都能 npm run dev/serve。
        要了解这些命令做了什么,就要去scripts中看具体执行的是什么代码。这里就像是一些命令的快捷方式,免去每次都要输入很长的的命令(比如 serve 那行)一般项目都会有 build, dev, serve 等,所以起名,最起码要从名字上基本能看出来是干什么的。

http://www.lryc.cn/news/217321.html

相关文章:

  • HTTP 协议请求头 If-Match、If-None-Match 和 ETag
  • DAY42 1049.最后一块石头的重量II + 494.目标和 + 474.一和零
  • uniapp原生插件之安卓华为统一扫码HMS Scan Kit
  • 数模国赛——多波束测线问题模型建立研究分析
  • [AUTOSAR][诊断管理][ECU][$37] 请求退出传输。终止数据传输的(上传/下载)
  • vue+canvas实现横跨整个页面的动态的波浪线(贝塞尔曲线)
  • LeetCode算法题解|​ 669. 修剪二叉搜索树​、108. 将有序数组转换为二叉搜索树、​538. 把二叉搜索树转换为累加树​
  • 直播界很火的无线领夹麦克风快充方案 Type-C接口 PD快充+无线麦克风可同时进行
  • Jmeter 汉化中文语言
  • centos9 stream 下 rabbitmq高可用集群搭建及使用
  • 代码随想录算法训练营第10天|232. 用栈实现队列 225. 用队列实现栈
  • 线上Kafka集群如何调整消息存储时间
  • [迁移学习]DA-DETR基于信息融合的自适应检测模型
  • 【MATLAB】全网唯一的13种信号分解+FFT傅里叶频谱变换联合算法全家桶
  • Nginx安装与配置
  • linux笔记总结-基本命令
  • [PHP]禅道项目管理软件ZenTaoPMS源码包 v16.4
  • Required String parameter ‘name‘ is not present
  • 路由器基础(五): OSPF原理与配置
  • Leetcode1128. 等价多米诺骨牌对的数量
  • Dev-C调试的基本方法2-2
  • 企业之间的竞争,ISO三体系认证至关重要!
  • node教程(四)Mongodb+mongoose
  • 作为一个初学者,该如何入门大模型?
  • 编译支持GPU的opencv,并供python的import cv2调用
  • Bug记录
  • web3 React dapp中编写balance组件从redux取出并展示用户资产
  • BIOS开发笔记 - DDR中的时序参数
  • 语义分割 - 简介
  • ch0_OSI 七层网络协议介绍