vue项目下常用的npm命令详解
更新时间：2025年08月05日 10:07:48 作者：北风toto
文章介绍了Vue项目中常用的npm命令：npm run serve启动、npm install安装依赖、npm run build构建,运行前后文件体积变化显著,需HTTP服务器运行,npm工具不仅限于Vue,还广泛应用于其他场景
1、npm run serve
- 一般为npm项目的启动命令
2、npm install
用于构建vue项目启动需要的环境
- 构建项目需要的依赖
- 运行前，文件总大小为1.8MB
运行后，大小为166MB，node_modules占了164MB
3、npm run duild
用于构建服务器启动，启动方式看参考文档（不是三言两语能解释的）
- 运行前
运行后，这个dist文件夹大致为10.9MB（作者的数据）
- 打包之后的使用
一开始运行npm run build 命令时，有这么一段提示：
这句话的意思就是：
构建文件务必放在一个HTTP服务器。直接打开index.html文件将不工作。
解决方式：
创建下面这个文件，重新运行npm run build
vue.config.js
module.exports={
publicPath:"./"
}
其他
npm不仅仅可以在vue中使用，还有不少的地方使用到这个工具，所以有不少的命令和vue并没有关系，npm只是vue项目中的一项工具而已。
总结
以上为个人经验，希望能给大家一个参考，也希望大家多多支持脚本之家。
相关文章
这篇文章主要介绍了vue 项目中实现按钮防抖方法,首先需要新建 .js文件存放防抖方法，引入防抖文件,methods中添加方法，本文结合示例代码给大家介绍的非常详细，需要的朋友可以参考下2022-12-12
这篇文章主要介绍了vue3实现alert自定义的plugins方式,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教2024-08-08
下面小编就为大家分享一篇vue中axios解决跨域问题和拦截器的使用方法，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧2018-03-03
Electron自动更新失效报错Error: Object has been destroyed的问题解决
本文主要讲解如何解决 Error: Object has been destroyed 这个 Electron 中最常见的问题,以及 Electron 自动更新的流程,文中通过代码示例给大家讲解的非常详细,需要的朋友可以参考下2024-01-01
这篇文章主要介绍了利用Vue实现数字翻滚动画效果,通过Vue的响应式数据更新结合CSS3的动画效果,我们可以实现非常酷炫的数字翻滚效果,给数据可视化带来更多动感和吸引力,需要的朋友参考下吧2024-04-04
本篇文章主要介绍了详解VUE中v-bind的基本用法 ，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧2017-07-07
新建项目的时候创建合理的目录结构便于后期的维护是很重要。这篇文章主要介绍了Vue+webpack项目配置便于维护的目录结构 ,需要的朋友可以参考下2018-10-10
这篇文章主要介绍了在Vue中实现随hash改变响应菜单高亮的方法，文中还通过实例代码给大家介绍了vue关于点击菜单高亮与组件切换的相关知识,需要的朋友可以参考下2020-03-03
这篇文章主要介绍了element-ui多文件上传的实现示例，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧2019-04-04
这篇文章主要介绍了vue数据操作之点击事件实现num加减功能,结合实例形式分析了vue.js事件响应及数值运算相关操作技巧,需要的朋友可以参考下2019-01-01
最新评论