代码 BUG 大全

mygoes

已于 2023-07-31 18:46:49 修改

阅读量9.2k

点赞数 14

文章标签： bug 前端全栈 node

于 2020-06-02 18:19:19 首次发布

本文链接：https://blog.csdn.net/mygoes/article/details/106500712

版权

程序员 BUG 大全

一、前端
二、后端

一、前端

1. VUE 篇

1.1 ElementUI 篇

BUG

报错
error TS7016: Could not find a declaration file for module 'fastscan'. 'D:/MyNam/Documents/Code/study/Koa2/3-前后端/1-前端模块/vue3-ts-project/node_modules/fastscan/index.min.js' implicitly has an 'any' type. Try npm i --save-dev @types/fastscanif it exists or add a new declaration (.d.ts) file containingdeclare module ‘fastscan’; 196 import FastScanner from "fastscan";
报错截图

问题
在 vue3 + ts 项目中，使用 fastscan 插件，在打包项目的时候，控制台报了这个错。
分析问题

没有 TS 类型声明文件

解决问题虽然 TS 是 JS 的超集，给予了类型支持，将动态类型编程语言转化成了静态类型编程语言。但是还是有很多插件是没有进行 TS 优化的。所以我们在使用这些插件的时候要手动导入/编写相关的类型声明文件。
解决问题具体操作找到 node_modules/fastscan 文件，新建 index.d.ts 文件，写入内容：declare module 'fastscan' 即可。

以上方法仅能简单搞定报错，实际解决还是要针对 index.js 文件内容编写对应的 index.d.ts 文件！

BUG

报错
transforming (701) node_modules\element-plus\es\components\table\src\table-columnsriews/index/mine/mine.vue:479:22 - error TS7016: Could not find a declaration file f module 'vue-image-crop-upload'. 'D:/MyNam/Documents/Code/study/Koa2/3-前后端/1-前端块/vue3-ts-project/node_modules/vue-image-crop-upload/upload-3.vue.js' implicitly h an 'any' type. Try npm i --save-dev @types/vue-image-crop-uploadif it exists or add a new decation (.d.ts) file containingdeclare module ‘vue-image-crop-upload’; 479 import myUpload from "vue-image-crop-upload";
报错截图

问题
在 vue3 + ts 项目中，使用 vue-image-crop-upload 插件，在打包项目的时候，控制台报了这个错。
分析问题

没有 TS 类型声明文件

解决问题手动编写个 .d.ts 应付一下。
解决问题具体操作找到 node_modules/vue-image-crop-upload 文件，新建 upload-3.vue.d.ts 文件，写入内容：declare module 'vue-image-crop-upload' 即可。

BUG

报错
对象的类型为 "unknown"。ts(2571)
报错截图

相关代码
const props = defineProps({
 dialogValue: {},
});

// ...

id: props.dialogValue.id
问题
在写 vue3 时，想接收 props 传来的一个对象，在使用对象的某条属性时，TS 检查报错了。
分析问题

TS 写错了

解决问题没有给 props 接收的对象定义类型注解，就使用对象的属性。
解决问题具体操作给 props 接收的对象一个类型

搞定！

BUG

报错
元素隐式具有 "any" 类型，因为类型为 "string" 的表达式不能用于索引类型 "{ username: string; password: string; phone: string; email: string; role: string[]; note: string; state: boolean; }"。在类型 "{ username: string; password: string; phone: string; email: string; role: string[]; note: string; state: boolean; }" 上找不到具有类型为 "string" 的参数的索引签名。ts(7053)
报错截图

相关代码
const form = reactive({
	username: "",
	password: "",
	phone: "",
	email: "",
	role: ["普通用户"],
	note: "",
	state: true,
});

// ...

for (const key in dialogValue) {
     if (Object.prototype.hasOwnProperty.call(dialogValue, key)) {
       // 多选框要数组格式进行渲染。格式转化：逗号分隔的字符串 → 数组
       if (key == "role") {
         form[key] = dialogValue[key].split(",");
       } else if (key == "state") {
         form[key] = dialogValue[key] == "1" ? true : false;
       } else {
         form[key] = dialogValue[key];
       }
     }
   }
问题
在写 TS 时，想通过一个 for 循环结合 对象[属性名] = 属性值 给 form 对象赋值，结果 TS 检查报错了。
分析问题

TS 写错了

解决问题没有给 form 定义类型注解，而且声明 form 时没有 key 这个元素，所以使用 form[key] 时 ts 报错了。在声明 form 时给个类型注解即可
解决问题具体操作找到 form 的定义处，给 form 一个 :{ [key: string]: any } 的类型注解。
搞定！

BUG

报错
Uncaught (in promise) RangeError: Maximum call stack size exceeded at ReactiveEffect.hasOwnProperty (<anonymous>)
报错截图

问题
在使用 Echarts 的时候，将从 Pinia 中获取到的数据赋值 Echarts，由此实现页面渲染，结果报错了。
分析问题

可能 Pinia 的数据有问题。
可能是 Echarts 渲染出现了问题。
可能是其它问题。

解决问题检查从 Pinia 存储，到 Pinia 取值，到赋值给 Echarts，发现是最后一步除了问题，赋的值格式不对。使用 computed 取值的时候，使用应该加上 .value。
解决问题具体操作将 eChartsData 改成 eChartsData.value 即可。
Bug 消失，搞定！

BUG

报错
TypeError: Converting circular structure to JSON
报错截图

问题
在 vue 3 项目中，请求接口时，报错了。
分析问题

可能是接口有问题。
可能是请求参数有问题。
可能是其它问题。

解决问题后端没有接收到参数，说明前端传参有误。检查了前端参数，发现某个参数是在 ref 中声明的，使用时没有加 .value，所以传的参数有误。
解决问题具体操作如下图：

搞定！

BUG

报错
GET https://i0.hdslb.com/bfs/archive/bf2aa1f18ccae9ecae4cb666417f75da951ee2f4.jpg@480w_300h.webp 403
报错截图

相关代码 <img :src="item.imgSrc" />
问题
在用 for 循环渲染轮播图时，图片的地址粘贴到浏览器可以正常访问到，但是在使用 img 标签渲染的时候，报错 403。
分析问题

可能是没有权限图片。
可能是标签有限制。
可能是其它问题。

解决问题从 img 标签换成 image 标签，没有用。最后利用一个叫 图片镜像缓存服务 的东西解决了问题。
解决问题具体操作在 img 标签中，把原来的 <img :src="item.imgSrc" /> 改成 <img :src="'https://images.weserv.nl/?url=' + item.imgSrc" /> 即可。

BUG

报错
TypeError: Converting circular structure to JSON
TypeError: Cannot read properties of undefined (reading ‘url’)
报错截图

问题
在 vue 3 中，发请求时报了这个错。
分析问题

可能参数有误。
可能是接口错了。
可能是其它问题。

解决问题检查了请求参数，发现传的参数格式不对，应该传 Number，我传的是一个 Object，原因是因为我少写了一个 .value。
解决问题具体操作加上 .value 即可。

搞定！

BUG

报错
Uncaught (in promise) TypeError: Cannot destructure property ‘containerEl’ of ‘el[SCOPE9]’ as it is undefined.
at updated (chunk-HXEEEQSK.js?v=7e7457e4:53761:13)
报错截图

问题
在使用 element-plus 框架写 vue3 项目时，用到 Container 布局容器组件和 Infinite Scroll 无限滚动组件，无意中出现了这个报错。
分析问题

可能是 Container 布局容器组件结构错误。
可能是 Infinite Scroll 无限滚动组件使用出了问题。
可能是其它问题。

解决问题检查组件结构，没有问题。检查 Infinite Scroll 无限滚动的使用，发现是 v-infinite-scroll 指令的使用出了问题。
解决问题具体操作 v-infinite-scroll 指令我没有用到过，直接删除了，报错就消失了。

搞定！

BUG

警告
Runtime directive used on component with non-element root node. The directives will not function as intended.
警告截图

问题
在用 element-plus 框架写 vue3 项目时，控制台出现了警告信息。
分析问题

可能是方法定义了没用上。
可能是 v-show、v-if 等操作隐藏了组件导致方法无法生效。
可能是其它问题。

解决问题在 element-plus 提供的组件上使用了 v-show 判断，用 div 标签把组件包一层，把 v-show 用在 div 标签上即可。
解决问题具体操作用 <div> 包裹把 element-plus 提供的组件 <el-popover> ，把 v-show 转移到 <div> 上。
搞定！

BUG

报错
Vue warn]: Duplicate keys detected: ‘0’. This may cause an update error.
报错截图

相关代码
<el-col v-for="item in basic2" :key="item.title" :xs="24" :sm="12" :md="12" :lg="8" :xl="8" </el-col>
问题
写了一个循环，结果报错了。
分析问题
在同一个盒子中，有两个 for 循环，它们的 key 均为 index，可能 key 冲突导致了报错。
解决问题修改循环中的 key 值，使其保持唯一性。

BUG

报错
This file should be served over HTTPS. This download has been blocked.
报错截图

相关代码
window.location.href ='http://yua......'
问题
在谷歌浏览器，https 网站中，想让点击按钮时可以下载 http 开头的资源文件，结果报错了。
分析问题
谷歌浏览器安全机制，不允许 https 下载 http 资源文件。
解决问题将 http 改成 https 即可。
解决问题具体操作我的资源路径本来是 http 开头的，手动将 http 改成 https 即可。如果资源路径是后端传过来的，可以用字符串拼接将 http 改成 https 即可。

BUG

报错
[Vue warn]: Computed property “passwordDialog” was assigned to but it has no setter.
报错截图

相关代码 :visible.sync="passwordDialog"
问题
使用 Element 框架的 Dialog 对话框时，将对话框的开启/关闭属性定义在 vuex 中，点击对话框右上角的叉叉关闭对话框时，结果报错了。
分析问题
Element 官方给的答复是：
如果 visible 属性绑定的变量位于 Vuex 的 store 内，那么 .sync 不会正常工作。此时需要去除 .sync 修饰符，同时监听 Dialog 的 open 和 close 事件，在事件回调中执行 Vuex 中对应的 mutation 更新 visible 属性绑定的变量的值。
解决问题如上所说，使用:visible 代替 :visible.sync，并且用@close 方法来定义对话框关闭的方法，即可
解决问题具体操作
html：

js：

番外：vuex 使用

BUG

报错
[Vue warn]: Invalid prop: custom validator check failed for prop “percentage”.
报错截图

相关代码 :percentage="(invoiceSuccessNum / invoiceNum) * 100"
问题
使用 Element 框架的 progress 进度条时，让进度条根据 invoiceSuccessNum 和 invoiceNum 这两个值来动态渲染，结果报错了。
分析问题
invoiceSuccessNum 和 invoiceNum 是后端返回的，可能为空，所以要做判断。
解决问题使用 v-if 判断下，若存在则渲染，即可
解决问题具体操作
html：

在这里插入图片描述

1.2 uni-app 篇

BUG

报错
[Vue warn]: Invalid default value for prop “leftIndexNumCollect”: Props with type Object/Array must use a factory function to return the default value.
报错截图

相关代码
leftIndexCollect: { type: Array, default: [] }
问题
在 uniapp 项目中，由父组件向子组件传值时，在子组件中接收，报错了。
分析问题

可能是子组件的数据类型定义错了。
可能是赋值时把父组件的数据类型更变了。
可能是其它问题。

解决问题
按控制台的错误提示可知，它让你 return 出去，由此在子组件 props 中更改初始化的结构就好了。
解决问题具体操作

BUG

报错
[Vue warn]: Error in onLoad hook: “SyntaxError: Unexpected token u in JSON at position 0”
报错截图

相关代码
JSON.stringify，JSON.parse
问题
在 uniapp 项目中，路由传参时，传了一个复杂字符串，跳转到目标页面时，报错了。
分析问题

可能是参数没有传过去。
可能是参数接收错误。
可能是其它问题。

解决问题
尝试了 JSON.stringify，JSON.parse，encodeURIComponent，decodeURIComponent等，最后发现是接收参数时，语法错了。
解决问题具体操作
更改参数的接收代码即可。
注意下面一个语法中有个大括号！！！

BUG

报错
[Vue warn]: Error in event handler for “service.requestComponentObserver”: “Error: Not Found：Page[1]”
报错截图

相关代码：略
问题
使用的 HBuildex （版本 3.1.18.20210609）、uniapp、uView UI（版本 1.8.2），代码运行在 H5 ，刷新浏览器后进行路由跳转，控制台偶尔会出现这个报错。
分析问题

网络延迟或权限问题产生找不到页面的原因。
可能是其它问题。

解决问题
尚未在代码层面解决此 BUG。初步判断是方法的执行时机，或 v-if 的页面加载时机导致。
官方给的解释是：
但是却并未解决到位，目前版本依旧会报错，也有网友反馈了此报错。
解决问题具体操作
浏览器刷新后等待几秒钟再进行路由切换操作，给程序一个刷新后的缓冲时间；同时不要快速的频繁的切换路由。

在这里插入图片描述

1.3 uni-cloud 篇

BUG

报错
项目database目录下缺少lottery_details.schema.json。如云端的该表已配置schema，请下载到database目录中
报错截图

问题
在服务空间A 中访问服务空间B，结果报错了。
分析问题

可能是 DB Schema 或扩展校验函数没有下载完成；
可能是其它问题。

解决问题如果是在同一个服务空间中，那么可以直接在uniCloud/database 文件夹下添加一个 .schema.json 文件即可。但是我是在服务空间A 中访问服务空间B，说直白点就是：跨服务空间访问数据库。
提示 缺少lottery_details.schema.json，所以在项目中搜索了所有 lottery_details，发现在跨服务空间访问数据库时，含lottery_details表的数据库的 spaceId 写错了，改正后，遍解决了问题。
解决问题具体操作

BUG

报错
未能获取当前用户信息：30205 | 当前用户为匿名身份
报错截图

问题
在使用 uniCloud 的 uni-admin 模板连接了腾讯云，在用户未登录的情况下访问了数据库，结果报错了。
分析问题

可能是 uni-admin 模板的哪里设了访问限制，要验证 token 才能访问；
可能是腾讯云哪里设了限制；
可能是其它问题。

解决问题找了半天没有找到设限的地方，且腾讯云允许匿名登录。
在偶然间尝试将 项目名/uniCloud/database 下的 .schema.json 文件中的 permission 的 read 字段的值改为 true 后，就可以正常访问了。
解决问题具体操作

BUG

报错
chunk-vendors.js:18840 Uncaught (in promise) a: errCode: DATABASE_REQUEST_FAILED | errMsg: [FailedOperation] multiple write errors: [{write errors: [{Cannot create field ‘lottery_date’ in element {request_data: null}}]}, {}]
或
“DATABASE_REQUEST_FAILED: errCode: DATABASE_REQUEST_FAILED | errMsg: [FailedOperation] multiple write errors: [{write errors: [{Cannot create field ‘lottery_date’ in element {request_data: null}}]}, {}]”

报错截图

相关代码

问题
在用 uniCloud 更改云数据库中的字段，结果报错了。

分析问题

可能是语法错了。
可能云数据库的配置错了。
可能是其它问题。

解决问题在云数据库中定义 request_data 字段时给了个初始值 null，结果更新的时候就报错了，我们在定义的时候把 null 值改为 {} 就行了，即：request_data: {}。
解决问题具体操作是字段不为 null 即可：

BUG

报错
Invalid prop: type check failed for prop “value”. Expected Array, String, Number, got Boolean with value false.
报错截图

问题
在使用 uniCloud 时，写了一个 .schema.json 文件，然后通过 schema2code 生成页面，在验证页面的新增功能时，在输入框中输入内容，报错了。
分析问题

可能是 .schema.json 文件中的类型写错了；
可能是 schema2code 生成的代码有问题；
可能是其它问题。

解决问题
由报错可知，大概率是 .schema.json 文件中的哪处 bool 类型出错了；找到有写到 bool 的地方，改变下代码即可。
解决方法1：（用 bool 就不要用 enum）>解决方法2：（用 string 代替 bool）

BUG

报错
禁止使用数据库内包含的字段名作为别名，产生冲突的数据表为…
报错截图

问题
在 HbuilderX 中，使用 uniCloud 的 schema2code，联系人表，联合民族表，报错了。
分析问题

可能是哪里写漏了。
可能是其它问题。

解决问题关联字段就好了。
解决问题具体操作

在这里插入图片描述

1.4 uView 篇

BUG

报错
[Intervention] Ignored attempt to cancel a touchmove event with cancelable=false, for example because scrolling is in progress and cannot be interrupted.
报错截图

相关代码 overflow-x: scroll;overflow: hidden; white-space: nowrap;
问题
需求：数据一行显示，超出的部分可以通过滚动显示，结果写 css 时报错了。
期望（只需左右滚动）：
结果（上下左右都能滚动，且在上下滚动时报错）：

分析问题
可能是左右滚动的同时进行了上下滚动；
可能是全局禁用了滚动；
可能 css 写错了；
其它原因。

发现同事引入的 /components/mescroll-uni/mescroll-uni.js 中有以下代码：

但这是引入的外部插件，直接针对它进行修改有点暴力。
截至 2021/07/20，在 uniapp 的 DCloud前端团队提供的新闻/咨询模板中，上下滚动长列表的同时进行左右滚动操作也会多次触发此报错，由此推断分析问题的第一种可能性占大头。

解决问题
（办法1）在 css 滚动的逻辑处写上：overflow-x: scroll; overflow-y: hidden;
（办法2）在 css 滚动的逻辑处写上：touch-action: 属性值，属性值有default和none。
解决问题具体操作
（办法1）在 css 滚动的逻辑处，写上 overflow-x: scroll; overflow-y: hidden;。

写个 overflow-x: scroll; 还要写 overflow-y: hidden; ε=(´ο｀*)))唉
（办法2）我试过在 css 中添加 touch-action 属性，但依旧是间接性出现报错，就不说了…

BUG

报错
Computed property “getData” was assigned to but it has no setter.
报错截图

报错代码截图

相关代码 computed: { getData() { return this.flowList; } },
问题
封装一个模块A，在调用A模块的时候传值给A，结果传值的时候报错了。
分析问题

可能违反了单项数据流原则。
可能没有很好处理双向数据绑定。
可能是其它问题。

解决问题想到了 set 和 get，一试，解决了。
解决问题具体操作
定位到 getData 报错的地方，换成以下写法：computed: { getData: { get() { return this.flowList; }, set(val) {}, } },

BUG

报错 Uncaught TypeError: Cannot read property ‘bottom’ of null
==报错截图=
问题使用 uView 时 , 使用吸顶效果 , 报错
分析问题 sticky组件创建了Observer监听，当切换页面且页面没有销毁（例如：tabbar页面）， sticky组件也没有销毁，自然beforeDestroy没有生效，导致组件仍然保持监听，所以出现Cannot read property ‘bottom’ of null报错。
解决问题 我们需要手动断开监听来解决这个报错。官方推荐了解决办法

解决问题代码：

<template>
	<view>
		<!--  @property {Boolean} enable 是否开启吸顶功能（默认true）-->
		<u-sticky :enable="enable">
			<view>
				……
			</view>
		</u-sticky>
	</view>
</template>
<script>
export default {
	data() {
		return {
			enable: true
		}
	},
	// 在对应的show和hide页面生命周期中打开或关闭监听
	onShow() {
		this.enable= true
	},
	onHide() {
		this.enable= false
	}
}
</script>

链接解决办法

BUG

报错 [Vue warn]: Invalid prop: type check failed for prop “volumeIcon”. Expected Boolean, got String with value “false”.
报错截图
问题使用 uView 时 , 使用文档 API 中的 Props 属性 , 报错
问题代码截图
分析问题没有正确地使用 Props 属性
解决问题 找到 Props 的正确使用方法即可
解决问题代码截图

链接 Props 中的属性使用教程

在这里插入图片描述

1.5 Vant 篇

BUG

报错 [Vue warn]: Unknown custom element: - did you register the component correctly? For recursive components, make sure to provide the “name” option.
报错截图
问题使用 Vant 时 , 按照 Vant 官网的介绍 ,在快速上手→引入组件中 , 使用方式一.自动按需导入组件(推荐) , 结果报错了
问题代码截图
分析问题只导入和使用 , 却没有注册/注册有误 .
解决问题 注册一下(注册方式有点意思)
解决问题代码截图

BUG

报错 vue.runtime.esm.js?2b0e:619 [Vue warn]: Unknown custom element: - did you register the component correctly? For recursive components, make sure to provide the “name” option.
报错截图
问题使用 Vant 时 , 自动按需导入组件(推荐) , 在用到 Cell 单元格时 , 已注册 Cell , 依旧报错了
问题代码截图
分析问题没有注册/注册有误 .
解决问题 以驼峰式单独注册一下 cell-group
解决问题代码截图

在这里插入图片描述

1.6 weex 篇

也是出于无奈 , 接手了一个 weex 框架的项目 . 搭环境(adk , jdk …) 和安装 Android Studio 什么的 , 麻烦 … 亲们 , 可以的话还是用 uni-app , Vant …框架替换掉 weex 吧

BUG

*报错 Failed to install the following Android SDK packages as some licences have not been accepted.
You have not accepted the license agreements of the following SDK components:
[Android SDK Build-Tools 26].
Before building your project, you need to accept the license agreements and complete the installation of the missing components using the Android Studio SDK Manager.
*报错截图

问题使用 weex run android 命令打包时 , 报错了
分析问题没有获取到 license
解决问题 设置一下 license
解决问题具体操作

找到报错的 SDK 路径 , 进入路径下 tools 文件 , 进入 tools 文件下的 bin 文件夹 , 打开命令行
( 本人的具体路径为 D:\Project\flutter\android\android-sdk\tools\bin> , 该路径下有一个 windows 批处理文件 sdkmanager , 用这个来解决问题 )
运行命令: sdkmanager --licenses
然后会有一大堆 licenses 等待你同意，全部选 yes . 完成 !
在 Android Studio 软件右上角的 SDK Manager → Android SDK → SDK Tools 勾选 Show Package Details 后再勾选 26 开头的所有包(26.0.3 和 26.0.2 和 26.0.1 和 26.0.0) 按 Apply 和 OK
以上两步基本能解决问题
解决此 bug 推荐文档 1
解决此 bug 推荐文档 2

BUG

报错
What went wrong:
A problem occurred evaluating project ‘:demo’.
Plugin with id ‘com.android.application’ not found.
Try:
Run with --stacktrace option to get the stack trace. Run with --info or --debug option to get more log output. Run with --scan to get full insights.
Get more help at https://help.gradle.org
报错截图

相关代码 gradlew --refresh-dependencies
问题
在 Android Studio (以下简称: AS) 为 WEEX 项目新增 极光推送 功能时，按照极光官网 jcenter 自动集成步骤 操作 , 在 AS 运行 gradlew --refresh-dependencies 重新刷新项目的依赖后，报错了。
分析问题

可能是无法找到项目Project的build.gradle里面的classpath。
可能是AS配置出现了问题。
可能是其它问题。

解决问题尝试了大牛们的各种方法，最终居然是 settings.gradle 文件中的 module 名写错了。
解决问题具体操作找到项目中的 settings.gradle 文件，将 include ':PhoneSdk' 替换其中。
在 AS 运行 gradlew --refresh-dependencies ，搞定！

在这里插入图片描述

1.7 杂七杂八篇

如果大家遇到这种因为点不出属性而报的 undefined 的 BUG：

1、我们可以在控制台找到报错的代码：

2、然后找到报错的文件路径：

3、使用?.或者if 判断 或者其它方法进行判断，从而解决报错：

关于可选链操作符 ?.的文章

分割图

2. react 篇

BUG

报错
Uncaught TypeError: Cannot assign to read only property ‘exports’ of object ‘#< Object>’
报错截图

相关代码
expo start
问题
在expo结合react-native框架写的移动app项目中，使用expo start运行项目，报错了。
分析问题
module.exports 导入使用不正确。
解决问题根据提示找到写错的代码更正即可。
解决问题具体操作
点击index.js报错，就可以找到报错的代码：
但是我把报错的 .exports = EZSwiper 粘贴到IDE全局搜索时，却没找到哪里有这句代码：
最终我在node_modules下找到了问题代码（服气 =_= ）：

将 module.exports = 改成export default 后报错就解决了：

导入组件的方法

BUG

报错
Uncaught Error: Cannot find module ‘react-router-dom’ at …
且
Module not found: Can’t resolve ‘react-router-dom’ in …
报错截图

相关代码
yarn add react-hot-loader -D
yarn start
问题
导入Element-react 框架后，使用yarn start运行项目，报错了。
分析问题
包没安装。
解决问题安装一下报错提示的包。
解决问题具体操作在项目的 cmd 命令控制窗口中输入npm install -S react-router-dom，然后npm start启动项目，搞定！

BUG

报错
Expected an assignment or function call and instead saw an expression no-unused-expressions
Search for the keywords to learn more about each error.
报错截图

相关代码
无
问题
使用map循环渲染页面的时候，报错了。
分析问题
大括号后面少了个return。

解决问题
方法1：在大括号后面加一个return。
方法2：修改箭头函数后面的大括号为小括号（ jsx 写法）。
方法3：不写括号。
解决问题具体操作
1、

2、
3、

BUG
报错
Warn：Can’t perform a React state update on an unmounted component. This is a no-op, but it indicates a memory leak in your application. To fix, cancel all aubscriptions and asynchronous tasks in the componentWillUnmount method. in Cart (created by Context.Consumer)
报错截图

问题
使用reducer订阅数据中心的数据时，报错了。
分析问题内存溢出：订阅数据后没有取消订阅。

解决问题在componentWillUnmount中取消订阅即可。
解决问题具体操作

标记处为修改的代码，搞定！

BUG

报错
[Intervention] Unable to preventDefault inside passive event listener due to target being treated as passive. See …
报错截图

相关代码
无
问题
使用 Ant Design Mobile 框架的 Carousel 走马灯时，引入官方演示代码到项目中，手动滑动轮播图的图片时，报错了。
分析问题
组件认为你的滑动操作没有对 CSS3 做优化。
解决问题你无法更改组件的内部样式，只能忽略优化：用标签包裹轮播图组件，给标签的 css 加一个样式代码：touch-action: none; 即可。
解决问题具体操作

分割图

3. Angular 篇

暂无
分割图

4. NodeJS 篇

BUG

报错
ER_NO_DEFAULT_FOR_FIELD: Field ‘id’ doesn’t have a default value
报错截图

相关代码 insert into login_history (user_id,note) values (${user_id},'哈哈')
问题
在用 node.js 写后端的时候，使用 SQL 语句新增一条数据，结果报错了。
分析问题

可能是 SQl 语句写错了。
可能是 MySQL 数据表哪里搞错了。
可能是其它问题。

解决问题检查发现是数据库的设计出了问题，主键 id 没有自动递增。
解决问题具体操作设计表的时候为主键 id 勾选上自动递增即可。

搞定！

BUG

报错
Unknown column ‘undefined’ in ‘where clause’
报错截图

相关代码
query(select * from user where (username= ${username}) or (phone=$ {phone}) or (username= ${username} and phone=$ {phone}) limit ${(currentPage - 1) * pageSize},$ {pageSize})
问题
在使用 node.js 的 Koa2 框架连接 MySQL 数据库进行查询操作，写 SQL 的时候，报错了。
分析问题

可能是 SQL 语句写错了。
可能是其它问题。

解决问题若你的 phone 是一个 number，但是数据库里存的是 string，要在模版外加一个引号，不然会报错。
我的问题是：username 是 string，但是没有加引号，所以报错了。
解决问题具体操作在 SQL 语句中，将 string 类型的字段用引号括起来，修改后的代码如下：
query(select * from user where (username=‘ ${username}') or (phone=$ {phone}) or (username=’ ${username}' and phone=$ {phone}) limit ${(currentPage - 1) * pageSize},$ {pageSize})
搞定！

BUG

报错
1142 - SELECT command denied to user ‘helloExpress’@‘localhost’ for table ‘user’
1045 - Access denied for user ‘root’@‘localhost’ (useing password:YES)
报错截图

问题
在使用 Navicat Premium 连接 mysql 数据库时，报错了；新建数据库时，也报错了。
使用命令行启动 mysql 时，也报错。
分析问题

可能是 mysql 没安装好。
可能是 mysql 密码错误。
可能是 mysql 权限问题。
可能是其它问题。

解决问题因为电脑安装了多个 mysql，存在多个 mysql 服务，有服务没有启动导致报错。
解决问题具体操作在计算机管理中启动 MySQL 服务。

被自己蠢到了。

记一下忘记 mysql 密码的解决办法：

第一步：以管理员身份开启命令行

第二步：切换到 MySQL 的安装目录

第三步：关闭 MySQL 服务器： net stop mysql
第四步：跳过 MySQL 权限验证：mysqld -console --skip-grant-tables --shared-memory

第五步：另开启一个管理员身份的命令行，切换到 MySQL 安装目录下

== 注意：不要关闭旧的命令行（见第十三步）。==
第六步：登录 MySQL：mysql -u root -p

第七步：直接回车，无需输入。

第八步：输入 use mysql;

注意：尾部分号；切勿省略。

第九步：将密码修改为 123456：update mysql.user set authentication_string = password("123456") where user="root";

第十步：刷新权限：flush privileges;

第十一步：退出 mysql ：quit;

第十二步：启动 mysql：net start mysql

第十三步：关闭（第一步）以管理员身份开启的第一个命令行

第十四步：登录mysql：mysql -u root -p

第十五步：输入 123456（第九步设置的）

最后，MySQL 登录成功！密码修改成功！

BUG

报错 nodemon : 无法加载文件 C:\Users\Administrator\AppData\Roaming\npm\nodemon.ps1，因为在此系统上禁止运行脚本。有关详细信息，请参阅 http://go.microsoft.com/fwlink/?LinkID=135170 中的 about_Execution_Policies。
报错截图
相关代码
安装 :npm install -g nodemon
使用 : nodemon [js文件名]
问题使用 VSCode 安装 node 代码自动运行工具后 , 在使用时 , 报错了
分析问题 VSCode 本身权限问题 .
解决问题 设置一下 VSCode 的权限
解决问题具体操作

右击 VSCode , 在属性中 , 以管理员身份运行程序

使用 win+R 快捷键 , 输入 powershell后点击确定 ;
在终端输入Start-Process powershell -Verb runAs 进入管理员命令窗口 ;
在管理员命令窗口输入set-ExecutionPolicy RemoteSigned 执行策略 , 选择 Y
回到 VSCode , 重新执行命令 , 问题解决 !

分割图

5. 代码托管平台篇

BUG

报错 'touch’不是内部或外部命令，也不是可运行的程序或批处理文件
报错截图

相关代码 touch README.md
问题使用码云创建仓库后 , 想和本地代码进行同步 . 在添加 README.md 文件时报错了
分析问题 touch 是 Linux 环境下的命令 , 不支持我们在 cmd 中使用 .
解决问题 使用 echo test>README.md 命令代替 touch README.md 命令
解决问题具体操作

BUG

报错 remote: You do not have permission push to this repository
fatal: unable to access ‘https://gitee.com/mygoes/shop.git/’: The requested URL returned error: 403
报错截图
相关代码 git push -u origin master
问题使用码云创建仓库后 , 想和本地代码进行同步 . 在推送本地代码时报错了
分析问题码云的凭据错误
解决问题 修改码云的 windos 凭据
解决问题具体操作

找到凭证管理器
编辑 Windows 凭证 ( 用户名/密码是登录码云的用户名/密码 )
在 cmd 中, 重新执行命令 , 问题解决 !

二、后端

1. Java 篇

BUG

报错
Cannot resolve symbol ‘value’
Error:(14, 6) java: 找不到符号
符号: 类 value
位置: 类 com.github.controller.BookController
报错截图

相关代码 @value("${country}")
问题
在 IDEA 中引入配置文件中的参数，结果报错了。
分析问题

可能是没有引入相关包。
可能是其它问题。

解决问题原来是 @value 写错了，首字母应该大写。
解决问题具体操作将 @value 改成 @Value 就行了。

分割图

1. Go 篇

BUG

报错
no required module provides package github.com/gin-gonic/gin: go.mod file not found in current directory or any parent directory; see ‘go help modules’
报错截图

相关代码 go get -u github.com/gin-gonic/gin，go run main.go
问题
在下载 gin 的时候，gin 的引入代码爆红，启动项目的时候，报错了。
分析问题

可能是环境变量配置错了
可能是 gin 下载失败了
可能是其它问题

解决问题项目开启了 gomod，先在项目根目录 go mod init 项目名
解决问题具体操作在项目目录下运行以下代码：
go mod init 项目名 （在当前项目下生成 gomod 文件）
go get -u github.com/gin-gonic/gin （下载并安装 gin）
go mod tidy （添加需要用到但 go.mod 中查不到的模块）
go run 文件名如：go run main.go （运行项目）

BUG 记录模板：

BUG

报错
What went wrong:
A problem occurred evaluating project ‘:demo’.
Plugin with id ‘com.android.application’ not found.
Try:
Run with --stacktrace option to get the stack trace. Run with --info or --debug option to get more log output. Run with --scan to get full insights.
Get more help at https://help.gradle.org
报错截图

相关代码 gradlew --refresh-dependencies
问题
在 Android Studio (以下简称: AS) 为 WEEX 项目新增 极光推送 功能时，按照极光官网 jcenter 自动集成步骤 操作 , 在 AS 运行 gradlew --refresh-dependencies 重新刷新项目的依赖后，报错了。
分析问题

可能是无法找到项目Project的build.gradle里面的classpath。
可能是AS配置出现了问题。
可能是其它问题。

解决问题尝试了大牛们的各种方法，最终居然是 settings.gradle 文件中的 module 名写错了。
解决问题具体操作找到项目中的 settings.gradle 文件，将 include ':PhoneSdk' 替换其中。
在 AS 运行 gradlew --refresh-dependencies ，搞定！