如何运行vue项目(详细步骤)
1、首先,将项目里的“node_modules”文件夹删除,这是vue项目的依赖包。
因为“node_modules”文件夹太大,一般不会打包上传到svn、git上的,所以没有这个文件夹就不用删。
2、删除package-lock.json。
package-lock.json记录了整个node_moudles文件夹的树状结构,还记录了模块的下载地址,但是它是基于项目作者的npm版本库生成的,若不删掉这个依赖文件,容易出现npm版本差异导致的报错。
3、然后打开cmd,cd到项目目录。
具体操作:先输入该盘符,然后再用cd命令切换目录。
4、输入命令npm clean cache -f,清除npm缓存,npm有缓存时,常常出现安装依赖不成功的现象,且一旦出现这个问题,报错信息很完善,但根据报错信息一项一项去解决,却死活解决不了,还找不出原因。
5、输入命令npm install,重新安装依赖。
6、输入命令npm run build 打包。
7、最后输入命令npm run dev/npm run serve(或者npm rum xxx)后项目成功运行。
这里注意有可能不同,npm run dev是vue-cli2.0版本使用的,npm run serve 是vue-cli3.0版本使用的,npm run xxx 中的 xxx 可以理解为键值对的 key,实际上 run 的是在 package.json 里面 scripts 配置的 value。
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"
}
如何运行vue项目(详细步骤)相关推荐
- vue-cli创建vue项目详细步骤
一.安装node环境(建议使用LTS) Download | Node.js 二.下载vue和vue-cli脚手架 命令:npm i -g vue ; npm i -g @vue/cli 三.在想要创 ...
- Vue项目打包步骤详细流程,新手必需掌握的知识点!
Vue项目打包步骤 Vue项目打包流程介绍 生成打包报告 修改默认配置 指定打包入口 通过external加载外部CDN资源 优化组件库的打包 首页内容定制 路由懒加载 Vue项目打包流程介绍 新手必 ...
- 使用vscode运行vue项目
!!学习完vue环境搭建并创建项目后下面我们介绍使用vscode运行vue项目.!! 文章参考:https://www.csdn.net/gather_29/OtTagg3sNzA2LWJsb2cO0 ...
- W7程序计算机面板介绍,win7系统隐藏任意程序运行界面的详细步骤
win7系统使用久了,好多网友反馈说win7系统隐藏任意程序运行界面的问题,非常不方便.有什么办法可以永久解决win7系统隐藏任意程序运行界面的问题,面对win7系统隐藏任意程序运行界面的图文步骤非常 ...
- 记录,再次运行vue项目报错POST http://127.0.0.1:8888/api/private/v1/login/login
可以打开登录界面,却无法打开登录后界面 代码没有问题,查阅资料后是后台服务器没打开 删除package-lock.json文件 运行npm install 再次运行node .\app.js 打开ph ...
- win10快速运行vue项目跑起来 - 方法篇
如何让win10更快速跑vue项目运行起来? 不用再每次先cd到项目目录了, 直接进入根文件夹后,再打开Powershell窗口,可以省略一大堆操作 (详情如下简介) 快捷操作如下: 先打开,并进入 ...
- php在u盘里运行,在U盘中直接运行Linux的详细步骤
在U盘中直接运行Linux的详细步骤 Linux以它的高效和灵活的特性深受着某些用户的喜爱,但是又不方便平时操作的习惯,如果用户不想在电脑上安装Linux系统,又想使用Linux系统的话,这里教大家一 ...
- 如何运行vue项目 ?(详解,建议收藏) ❤️
如何运行vue项目 (详解,建议收藏) 转载 首先,列出来我们需要的东西: node.js环境(npm包管理器) vue-cli 脚手架构建工具 cnpm npm的淘宝镜像 安装node.js 从no ...
- 运行VUE项目时,出现npm ERR! A complete log of this run can be found in:...报错
运行VUE项目时,出现npm ERR! A complete log of this run can be found in:报错时,分享以下一种解决方案. 本机的 node版本如下 解决方法 1. ...
- 优购商城项目 详细步骤流程
优购商城项目 详细步骤流程 一.准备的工作 1.文档 写项目之前必须要有接口文档 准备工作接口文档是必不可少的 参考文档我们还可以参考 小程序的开发文档.阿里巴巴字体 iconfont .mdn- 2 ...
最新文章
- 如何在AjaxPro.net的AjaxMethod中使用session和cookie
- 用verilog实现检测1的个数_入门指南:用Python实现实时目标检测(内附代码)
- JAVA自学笔记24
- python bs4模块_python爬虫之Beautifulsoup模块用法详解
- oracle调用存储过程和函数返回结果集
- dubbo源码解析(四十一)集群——Mock
- python文件图标变成小电脑_手把手教你给Python程序写图形界面,并且打包成exe文件-exe文件...
- #詹青云 为什么我要在最好的年纪离开你
- 作者:赵妍妍(1983-),女,哈尔滨工业大学机电学院媒体技术与艺术系副教授、硕士生导师。...
- 买书动态规划java_《编程之美》买书问题——动态规划
- 解决上左右页面框架中iframe的引起的滚动条问题
- 不当IT民工——技术带来质的飞跃
- 详解KITTI数据集
- 小知识点日记 2013-1-17 至 2013-6-13
- 读书笔记-反省使人成长
- 百度api获取经纬度以及经纬度的转换
- 一个在线显示doc文本的实例
- Python.exe - 无法找到入口/无法定位程序输入点...于动态链接库
- ubuntu oracle工具下载,Ubuntu Oracle SQL Developer 1.5 下载
- wwwwwwwwwww
热门文章
- 【Ceph】Ceph常用命令|Ceph配置参数和命令解析|ceph管理
- HTML特殊转义字符
- 论文翻译——中国武汉市2019年新型冠状病毒感染患者的临床特征
- 使用yx-tiny命令行工具进行图片压缩
- 你知道八皇后嘛?就是那个八皇后
- HTML5与视频传输_拔剑-浆糊的传说_新浪博客
- 用 C# 实现独占音频设备降低其它程序的音量
- 手机短信转发到另一个手机接收_怎么把手机号码导入另一个手机中(新手机是华为的,旧手机是三星的)...
- 单调有界定理适用于函数吗_用极限定义证明一些极限的性质定理
- 求佩波拉切数列的前20项