关于vue项目vue-cli-service启动报错失败问题的解决方法

 更新时间:2024年08月19日 11:14:34   作者:孙怼怼啊  
前端拉取代码后,想要运行代码的时候可以能遇到启动报错的问题,这里我们只针对于vue-cli-service报错项来说,文中通过图文结合的方式给大家介绍的非常详细,具有一定的参考价值,需要的朋友可以参考下

前端拉取代码后,想要运行代码的时候可以能遇到启动报错的问题,这里我们只针对于vue-cli-service报错项来说

情况一(运行前没有正常安装依赖包)

//	运行项目
npm run serve

这里我们可以看出是报错了的,那么这个原因呢就是没有安装vue-cli-service导致的

在这里插入图片描述

解决方案呢就是咱们正常安装下依赖包

npm install 或者 yarn

依赖全部安装完成后,运行一下看看结果,可以看到项目正常启动

在这里插入图片描述

情况二(针对内网开发,或者网络不好,导致其余依赖安装上但是vue-cli-service没有装上)

那么针对这种情况呢,咱们可以换一种运行方式

1.找到项目中的package.json文件

正常呢是配置的vue-cli-service serve这个命令

在这里插入图片描述

2.我们要替换命令启动方式、或者自己重新新建一条命令(这里都可)

这里为了方便比较 我选择新建一条命令对比
关键点就在于我们没有vue-cli-service,但是有需要启动服务,这时候我们就需要去寻找vue依赖中的打包服务
我们需要在node_modules文件中找到这个文件的路径 然后替换到命令中

在这里插入图片描述

我的整个项目的文件路径为这个C:\Users\90706\Desktop\ziSheng\demo\node_modules@vue\cli-service\bin

在这里插入图片描述

那么替换后的script命令为

 "scripts": {
    "serve": "vue-cli-service serve",
    "devServer": "node C:\\Users\\90706\\Desktop\\ziSheng\\demo\\node_modules\\@vue\\cli-service\\bin\\vue-cli-service serve",
    "build": "vue-cli-service build",
    "lint": "vue-cli-service lint"
  },

我们来试试新指令

在这里插入图片描述

这里可以看到,咱们这也是可以成功运行了,所以说多学两种方法 以后可能还是会用的上的

以上就是关于vue项目vue-cli-service启动报错失败问题的解决方法的详细内容,更多关于vue-cli-service启动报错失败的资料请关注脚本之家其它相关文章!

相关文章

  • 详解vue3中setUp和reactive函数的用法

    详解vue3中setUp和reactive函数的用法

    这篇文章主要介绍了vue3函数setUp和reactive函数的相关知识及setup函数和reactive函数的注意点,通过具体代码给大家介绍的非常详细,需要的朋友可以参考下
    2021-06-06
  • vue-cli3项目配置eslint代码规范的完整步骤

    vue-cli3项目配置eslint代码规范的完整步骤

    这篇文章主要给大家介绍了关于vue-cli3项目配置eslint代码规范的完整步骤,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2020-09-09
  • Vue3 实现验证码倒计时功能

    Vue3 实现验证码倒计时功能

    这篇文章主要介绍了Vue3 实现验证码倒计时功能,倒计时的运用场景是获取手机验证码倒计时、获取邮箱验证码倒计时等场景,本文结合示例代码给大家详细讲解,需要的朋友可以参考下
    2023-01-01
  • vue自定义指令实现懒加载的优化指南

    vue自定义指令实现懒加载的优化指南

    这篇文章主要为大家详细介绍了vue如何通过自定义指令实现懒加载并进行相关优化,文中的示例代码讲解详细,感兴趣的小伙伴可以跟随小编一起学习一下
    2025-07-07
  • Vue 组件参数校验与非props特性的方法

    Vue 组件参数校验与非props特性的方法

    这篇文章主要介绍了Vue 组件参数校验与非props特性的方法,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2019-02-02
  • vuex中的 mapState,mapGetters,mapActions,mapMutations 的使用

    vuex中的 mapState,mapGetters,mapActions,mapMutations 的使用

    在vuex中有四大金刚分别是State, Mutations,Actions,Getters,本文对这四大金刚做了详细介绍,本文重点是给大家介绍vuex中的 mapState,mapGetters,mapActions,mapMutations 的使用,感兴趣的朋友一起看看吧
    2018-04-04
  • vue实现公共组件传值并及时监听到数据更新视图

    vue实现公共组件传值并及时监听到数据更新视图

    这篇文章主要介绍了vue实现公共组件传值并及时监听到数据更新视图方式,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教
    2023-01-01
  • vue3中form对象无法赋值的问题解决

    vue3中form对象无法赋值的问题解决

    这篇文章给大家介绍了vue3中form对象无法赋值的问题解决,有时候对象的值死活赋不上值,这时候可以看下赋值的对象变量名是否和页面组件中的ref相同,文中给出了代码示例供大家参考,需要的朋友可以参考下
    2024-01-01
  • 浅谈vue实现双向事件绑定v-model的原理

    浅谈vue实现双向事件绑定v-model的原理

    vue使用v-model实现数据的双向绑定,它会根据控件类型自动选取正确的方法来更新元素,本文就详细的介绍一下原理,感兴趣的可以了解一下
    2021-08-08
  • Vue项目结合Vue-layer实现弹框式编辑功能(实例代码)

    Vue项目结合Vue-layer实现弹框式编辑功能(实例代码)

    这篇文章主要介绍了Vue项目中结合Vue-layer实现弹框式编辑功能,本文通过实例代码给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下
    2020-03-03

最新评论