前端开发：npm run serve 和 npm run dev 的区别

前言

前端开发过程中运行 Vue 项目的时候，有时候使用 npm run serve 命令可以启动项目，有时候却会报错；有时候使用 npm run dev 命令可以启动项目，有时候却也会报错。是什么原因造成这种情况呢，原因在于 Vue 脚手架版本的问题，也可以理解为执行配置的脚本问题，有的脚手架版本支持 npm run serve 命令启动项目，有的脚手架版本却支持 npm run dev 命令启动项目。那么本篇博文就来分享一下怎么避免由于脚手架版本不同造成的启动项目时候的报错问题。

报错提示

先来分享一个运行 npm run serve 命令启动项目不成功的报错原因，具体报错如下：

Cheeng$ npm run serve
npm ERR! missing script: serve
npm ERR! A complete log of this run can be found in:
npm ERR!     /Users/Ceng/.npm/_logs/2020-11-13T058_226Z-debug.log

分析

通过分析上述的错误报错：**npm ERR! missing script: serve**问题，是在 VSCode 的 Terminal 中运行启动项目的时候出错，针对上述的问题，可以直接去项目里面的**package.json**文件中查看对应的命令行。这样就可以避免对应的报错问题。

解决方法

直接在前端项目里面找到并打开**package.json**文件，然后在文件中找到 scripts，在 start 这里面定义了运行 Vue 的时候，是使用 npm run serve 还是 npm run dev。具体的对比如下所示：

打开项目的 package.json 文件，找到该文件里面的 scripts

根据 scripts 里面写的是 serve 还是 dev 来启动前端项目：

因此，在运行 Vue 项目的时候，npm run serve 和 npm run dev 的区别就在于 vue-cli 脚手架的版本，具体情况还是要根据项目的实际情况来处理。

最后

通过上面介绍的关于前端开发中 npm run serve 和 npm run dev 的区别以及运行项目报错的原因，往后再在前端开发中遇到类似操作就可以很好的解决了，这也是在开发过程中必用的功能，尤其是对于初级开发者来说，更应该掌握这些情况的使用，这里不再赘述。

以上就是本章全部内容，欢迎关注三掌柜的微信公众号“程序猿 by 三掌柜”，三掌柜的新浪微博“三掌柜 666”，欢迎关注！