uni-app 经验分享，从入门到离职（Debug篇）——运行拷贝的项目在其他电脑运行出现的报错以及解决方案

---

前言

这篇文章的内容的记录一下在运行 uni-app 项目的时候遇到的报错，以及解决报错的过程。报错原因是，拷贝新项目，在另一台电脑运行时出现的依赖报错，以及运行到微信开发者工具出现的报错等等。

⏬关于专栏

本篇文章是我的 uni-app 专栏的第二篇文章，这个专栏主要是分享和介绍从零到一学习和使用的 uni-app 的笔记和个人经验。通过个人的学习经验和工作经验来给大家分享关于 uni-app 开发的技巧，以及快速入门的诀窍等等。

专栏主页：uni-app_黛琳ghz的博客-CSDN博客

---

运行拷贝的新项目

凡事都有因果，首先我们来看下报错是如何生成的，以及分析为什么会出现这种报错的原因。首先在编译器（hbx）运行项目（项目以测试项目为名称），选择运行在微信开发者工具。运行后出现如下报错。

我们从报错第一条开始看，可以发现报错的原因是 sass 的版本依赖问题。

接下来针对这个报错，我们一步一步来解决这个报错，以及后续出现的报错。

---

关于报错：sass 依赖问题与代码报错

首先我们可以看到运行到微信开发者工具后，并没有运行成功，而是出现了依赖问题的报错，如上图。其实很明显，我们看项目的目录，发现并没有 node_modules 这个依赖文件。出现这个原因只能说是粗心的原因了，通过窗口的报错可以发现是 sass 的依赖问题，一开始还认为是 sass 的版本问题，但是项目中根本没有 sass 的依赖。

接下来，打开编译器的终端，安装相关依赖和 node_modules 包，使用如下的命令。

npm install node-sass

我们可以看到项目目录中出现了 node_modules 包，以及终端窗口开始下载了。安装完成之后，我们重新运行到微信开发者工具。

但是项目还是出现了运行报错，说明还有在代码上的报错问题，我们仔细看下图的报错信息，是因为项目中的部分代码的报错导致的。（项目在原电脑运行正常）

解决方法

全局搜索项目中的 /deep/ 然后全部替换成 ::v-deep 即可解决。

然后再次运行，我们可以发现之前的报错没有出现了，说明问题解决了，运行窗口出现编译启动的消息提示了。

然后我们可以发现微信开发者工具打开了，并且运行了该项目，说明 uni-app 项目成功运行到微信开发者工具了。

意外情况

如果运行成功后，弹出了微信开发者工具，但是没有打开运行的项目，说明还存在一些配置要处理。首先我们要从头开始排查是否缺漏了 uniapp 运行微信小程序准备操作。

• 首先要打开manifest.json获取uni_appId。
  
• 然后要打开微信开发者工具中的服务端口。
  
• 然后还要在 Hbuilder 中配置微信开发者工具的路径。
• 最后也是最重要的，查看运行的项目是否配置了 appid。
  

❗注意

然后说回，弹出了微信开发者工具，但是没有打开运行的项目这个特殊情况。原因是在于 appid 的问题，在运行其他人的项目或者在新电脑运行的时候，我们要把编译器上面配置好的 appid 先清空，然后再去运行，以游客身份的启动微信开发者工具，这样就可以解决这个问题了（亲测有效）。如果后续需要加上 appid 来开发，直接填上，在运行就没有这个问题了。

---

最后

到此就是本篇文章的全部内容了，这篇文章记录了运行拷贝的项目在其他电脑运行出现的报错以及解决方案。这篇文章是博主 uni-app 专栏的 Debug 篇的文章，后续会不断的更新更多关于 uni-app 的干货、实战经验、学习经验，期待你的关注和留言。