超详细关于vue项目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-cli-service serve' 报错解决方案 #### 权限不足导致的报错 当在Linux系统上尝试通过`npm run serve`启动Vue项目时,如果收到类似`sh: 1: vue-cli-service: Permission denied`的信息,则表明当前用户对于`vue-cli-service`文件缺乏必要的执行权限。为了修正这个问题,应当调整相应文件的访问权限设置: ```bash cd /path/to/your/project chmod 777 node_modules/.bin/vue-cli-service ``` 上述命令会给予`vue-cli-service`完全控制权,从而允许其被执行[^2]。 #### 缺失依赖项引起的错误 另一种常见情况是,在Windows环境下输入`vue-cli-service serve`后提示这不是有效的命令或程序。这通常是因为项目的`node_modules`目录缺失或是不完整造成的。此时建议移除旧有的`node_modules`并重新安装所有必需的依赖库来解决问题: ```bash rm -rf node_modules/ npm install ``` 完成以上操作之后再次尝试运行服务应该能够恢复正常工作状态[^3]。 #### IP配置不当引发的问题 还有可能是由于网络接口配置有误所引起的服务无法正常启动的情况。具体表现为试图绑定至特定IP地址失败问题。针对这种情况,可以通过编辑位于项目根目录下的`vue.config.js`文件中的server选项来自定义host参数,确保它指向正确的服务器监听地址即可解决此问题[^4]: ```javascript module.exports = { devServer: { host: 'localhost', // 修改成实际使用的主机名或IP地址 } }; ``` 综上所述,面对不同类型的`vue-cli-service serve`启动失败情形,可以根据实际情况采取相应的措施来进行修复。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值