清风明月的博客-CSDN博客

原创 vue-i18n的9以上的版本中@被用作特殊字符处理，直接用会报错

国际化使用 "validation.regExp.name": "仅允许输入字母、数字与_.@字符"报如下错误Message compilation error: Invalid linked format1 | 仅允许输入字母、数字与_.@字符Message compilation error: Unexpected lexical analysis in token: '字符'1 | 仅允许输入字母、数字与_.@字符Message compilation error: Unexpect

2022-05-20 19:56:48 5195 1

原创 vite项目在jenkins自动打包报错：failed to load config from ../vite.config.js You installed esbuild on

vite项目在jenkins自动打包报错找不到esbuild-linux-64在window环境开发用的找不到esbuild-windows-64，在linux环境构建需要使用esbuild-linux-64，找不到esbuild-linux-64就会报错实际报错：error during build:11:21:11 Error: 11:21:11 You installed esbuild on another platform than the one you're currently us

2022-04-11 20:02:44 26395 3

原创 vue.3.0+vite+ts的uni-app项目Typescript引起的报错处理

Typescript引起的报错处理1、Non-relative paths are not allowed when ‘baseUrl’ is not set. Did you forget a leading ‘./’?在tsconfig.json文件中加：{ "baseUrl": ".",}2、Cannot find module ‘@/utils/login’ or its corresponding type declarations.ts(2307)在tsconfig.jso

2021-12-26 21:35:25 5454

原创 uni-app项目报could not fetch remote https://github.com/dcloudio/uni-preset-vue错解决

由于网络或者域名拦截的引起的用cli创建vue.3.0+vite+ts的uni-app项目时的报错运行命令行 npx degit dcloudio/uni-preset-vue#vite my-vue3-project报如下错误：$ npx degit dcloudio/uni-preset-vue#vite my-vue3-project! could not fetch remote https://github.com/dcloudio/uni-preset-vue! could not f

2021-12-26 21:34:02 7535

原创 uni-app系列（一）用cli创建支持Vue3/Vite的uni-app项目

更新HBuilderX编译器到3.3.0+，HBuilderX 3.3.0+的编辑器支持基于 Vite 编译到小程序平台。至此，uni-app在App/H5/小程序全平台支持Vue 3.0开发，且全平台支持Vite编译器。用cli创建支持Vue3/Vite的uni-app项目1、命令行创建 Vue3/Vite 工程# 创建以 javascript 开发的工程 npx degit dcloudio/uni-preset-vue#vite my-vue3-project # 创建以 types

2021-12-26 21:31:57 3257 2

原创设置 column.ellipsis 报错[antd: Typography] `ellipsis` should use string as children only.

ProTable和`Table设置 column.ellipsis 可以让单元格内容根据宽度自动省略时报以下错误：[antd: Typography] `ellipsis` should use string as children only.原因：ellipsis：true 只能用在返回为字符串的列

2021-09-02 14:14:25 1808

原创用Git命令撤销本地commit提交的办法

1、未使用 git add 缓存代码，需要放弃本地修改// 放弃单个文件修改,注意不要忘记中间的"--",不写就成了检出分支了!git checkout -- filepathname// 放弃所有的文件修改git checkout . 2、已使用git add 缓存代码，需要先放弃缓存//放弃单个文件缓存 git reset HEAD filepathname//放弃所有缓存git reset HEAD . // 放弃单个文件修改,注意不要忘记中间的"--",不写就成了检出分支了!

2021-09-01 20:39:42 11314 1

原创 ant design的关闭ModalForm和Modal弹框，清除数据的方法

ant design的关闭ModalForm和Modal弹框，清除数据的方法:1、ModalForm弹框modalProps中加destroyOnClose<ModalForm visible={visible} modalProps={{ destroyOnClose: true }}/></ModalForm>2、Modal弹框中加destroyOnClose<Modal visible={visible} destroyOnClose: {t

2021-08-31 14:43:05 6831 3

原创解决Ant Design错误警告：validateDOMNesting(...): ＜form＞ cannot appear as a descendant of ＜form＞.

在ModalForm弹框中使用带搜索的ProTable，报如下错误：devScripts.js:6523 Warning: validateDOMNesting(...): <form> cannot appear as a descendant of <form>.错误信息：<form>里面不能嵌套<form>产生原因：ModalForm是带form的，ProTable的搜索框也是带form的，所以会报错。...

2021-08-30 20:34:27 18044 4

原创 checkbox默认样式修改，自定义样式加scoped不生效

1、效果图2、Html代码<v-row title="抬头类型"> <checkbox-group > <label> <checkbox :value="titleType" checked="true" />个人或事业单位 </label> <label> <checkbox :value="titleType" /&

2021-08-28 21:20:34 348

原创 uniapp开发支付宝小程序报错TypeError: Cannot read property ‘__VUE_DEVTOOLS_GLOBAL_HOOK__‘ of undefined

用uniapp+vue3.0+ts开发支付宝小程序报错如下：TypeError: Cannot read property ‘VUE_DEVTOOLS_GLOBAL_HOOK’ of undefined解决办法如下：进入 /node_modules/vuex/dist/vuex.esm-browser.js 和 /node_modules/vuex/dist/vuex.esm-bundler.js。搜索useDevtools，你会看到以下代码：var useDevtools = this._devt

2021-08-28 20:56:51 1708

原创 uniapp + vue3.0 + ts + vuex4开发支付宝小程序的报错处理

vue开发报错Syntax Error: ‘import’ and ‘export’ may only appear at the top level.报错原因：export多个工具函数时，少写了}大括号解决方法：加上}

2021-08-28 20:53:34 2217 1

原创简单的表述Webpack的构建流程

webpack的运行流程是一个串行的过程，从启动到结束的流程如下：1、初始化参数从配置文件和shell语句中读取与合并参数，得出最终的参数；2、开始编译用上一步得到的参数初始化Compiler对象，加载所有的配置插件，执行对象的run方法开始进行编译；3、确定入口根据配置的entry找出所有的入口文件；4、编译模块从入口文件出发，调用所有的配置Loader对模块进行翻译，再找出模块依赖的模块，再递归本步骤直到所有的入口依赖的文件都经过了本步骤的处理；5、完成模块编译在使用Loader.

2021-08-28 20:47:42 280

原创 × Error: The slice reducer for key “auth“ returned undefined during initialization. If the state pas

Error: The slice reducer for key “auth” returned undefined during initialization. If the state passed to the reducer is undefined, you must explicitly return the initial state. The initial state may not be undefined. If you don’t want to set a value for th

2021-07-03 09:47:05 2625

原创用getPopupContainer解决Select ProFormSelect DatePicker ProFormDatePicker下拉框在滚动时偏移错位问题

1、Select使用getPopupContainer改变浮层渲染父节点<Select defaultValue="lucy" getPopupContainer={triggerNode => triggerNode.parentElement} onChange={handleChange} > <Option value="jack">Jack</Option> <Option value="lucy">Lucy</Opti

2021-06-29 16:53:48 2788 1

原创 @tarojs/plugin-mock使用详解

@tarojs/plugin-mock Taro 数据 Mock 插件1、安装$ npm i @tarojs/plugin-mock --save2、引入插件修改项目 config/dev.js或者 config/index.js中的 plugins 配置为如下module.exports = { plugins: [ [ "@tarojs/plugin-mock", { //Mock 插件可以接受如下参数 .

2021-06-18 14:11:52 1584 4

原创使用@tarojs/plugin-mock小程序开发工具返回statusCode: NaN解决

使用@tarojs/plugin-mock小程序开发工具返回statusCode: NaN原因：小程序开发工具启用了Mock解决办法：在小程序开发工具调试器—找到Mock—关闭启用Mock

2021-06-18 12:02:57 608

原创 [vuex] unknown mutation type: RememberPassword报错解决

[vuex] unknown mutation type: RememberPassword(env: macOS,mp,1.05.2105170; lib: 2.16.0)

2021-06-11 13:48:44 525

原创 Taro+Vue3.0+Typescript开发小程序遇到的报错解决

1、defineConstants引入全局变量报错：Uncaught SyntaxError: missing ) after argument list，一定先加双引号，再加单引号defineConstants: { BASE_URL:'"/api"',},2、import { getWindowHeight } from "@/utils/utils"报错：找不到模块“@/utils/global”或其相应的类型声明在config文件夹下的index.js文件的alias设置别名co

2021-06-08 20:53:43 1856

原创项目中vite1.0升级到vite2.0，vite.config.js 配置报错解决方案整理

把项目中vite1.0升级到vite2.0，遇到一些报错，下面是整理的一些解决方法。1、报错：warning: Duplicate key “server” in object literal vite.config.js:67:4: warning: Duplicate key "server" in object literal 67 │ server: { ╵ ~~~~~~ vite.config.js:29:4: note: The original

2021-05-26 10:44:36 12258

原创 npm i 安装插件报：permission denied, symlink

npm i serve -g报如下错误：permission denied, symlinkError: EACCES: permission denied, symlink '../lib/node_modules/serve/bin/serve.js' -> '/usr/local/bin/serve'npm ERR! [OperationalError: EACCES: permission denied, symlink '../lib/node_modules/serve/bin/se

2021-05-25 17:21:15 2081

原创微信小程序运行报错：WebAssembly.instantiate(): Argument 0 must be a buffer source or a WebAssembly

微信小程序运行报错：VM94:1 Unhandled promise rejection TypeError: WebAssembly.instantiate(): Argument 0 must be a buffer source or a WebAssembly.Module object解决办法：修改调试基础库点击编辑器右上角“详情”—“本地设置”—选择低版本的调试基础库—问题解决...

2021-05-25 15:40:33 2075

原创深入了解requestFullscreen()方法实现全屏显示

全屏显示:const openFullscreen = () => { /* 获取(<html>)元素以全屏显示页面 */ const full = document.getElementById('content') if (full.RequestFullScreen) { full.RequestFullScreen() } //兼容Firefox if (full.mozRequestFullScreen) {

2021-05-18 17:21:55 17628 4

原创使用装饰器可能会提示 Property assignment expected.Vetur(1136)

使用装饰器可能会提示Property assignment expected.Vetur(1136)因为使用eslint进行代码格式检查，所以可以关闭vetur验证script的能力，请在vscode settings里面添加下面代码"vetur.validation.script": false,

2021-05-12 16:36:13 5744 1

原创 18条Vue项目代码和性能优化整理

1、v-if和v-show区别：v-if为false时不渲染DOM，v-show渲染DOM权限相关的展示用v-if其他频繁切换用v-show，不频繁切换用v-if使用v-if可以减少DOM数量，加快页面渲染使用三木运算符、&&或者||替代v-ifv-if里面的表达式与判断，建议在methods和computed里面封装成一个方法，方便复用错误优先出returnif (!valid) { this.$message.error('信息输入有误'); retu

2021-05-11 21:13:14 1269

原创 git pull和git pull origin master报如下警告Pulling without specifying how to reconcile divergent branches

git pull和git pull origin master报如下警告hint: Pulling without specifying how to reconcile divergent branches ishint: discouraged. You can squelch this message by running one of the followinghint: commands sometime before your next pull:hint: hint: git c

2021-05-08 14:33:47 7257 1

原创 umi Ant Design使用 @alitajs/keep-alive实现KeepAlive状态保存

使用 @alitajs/keep-alive，需要使用组件包裹 layout 的最内层。原理就是劫持了 children1.安装 @alitajs/keep-aliveyarn add @alitajs/keep-alive//或者npm install @alitajs/keep-alive2、在config.js页，即配置页面export default { plugins:['@alitajs/keep-alive'], keepalive:['/about'] //需要Kee

2021-05-08 11:21:24 2270 1

原创 umi Ant Design 使用umi-plugin-keep-alive实现KeepAlive状态存储

使用umi-plugin-keep-alive实现KeepAlive状态存储1、安装$ npm install umi-plugin-keep-alive --save//或者$ yarn add umi-plugin-keep-alive2、使用import { KeepAlive } from 'umi'const contentList = () => { return ( <> <KeepAlive name="/About" //可按照

2021-05-08 11:19:06 8486

原创解决brew报错 in `initialize‘: Version value must be a string； got a NilClass ()

原因： Mac 在升级为macOS Big Sur 系统，版本11.1后，之前旧版本的Homebrew在新系统不适配，报in `initialize’: Version value must be a string; got a NilClass ()解决办法：直接更新到最新版本的Homebrew就可以了$ brew update-reset重新查看版本，可以了$ brew --versionHomebrew 3.1.5-101-gd3013fc...

2021-05-07 16:48:23 5546

原创 MAC 上解决zsh: command not found: umi

全局安装umi$ tarn global add umi$ umi [email protected]在运行umi -v时报 zsh: command not found: umi错误，解决办法如下：1、获取global bin路径$ yarn global bin/Users/*****/.yarn/bin2、运行open命令，打开.bash_profile文件$ open ~/.bash_profile3、在.bash_profile文件添加下面一行，保存export PATH="你的

2021-05-06 20:49:35 3279

原创 Ant Design ProFormDigit fieldProps 限制输入的小数位数

ProFormDigit 使用min限制可输入最小值，max限制可输入最大值， fieldProps限制输入的小数位数保留两位小数 fieldProps={{ precision: 2 }}<ProFormDigit label="InputNumber" name="num" min={1} max={22} fieldProps={{ precision: 2 }}/>整数fieldProps={{ precision: 0 }}<ProFormDigit

2021-05-06 14:43:25 6248 3

原创 Ant Design ModalForm 打开二级弹框引起的页面滚动条失效解决方法

Ant Design React 遇到打开二级弹框引起的页面滚动条失效，使用的是ModalForm。原因：在打开弹框的时候会给body标签上加style=“width: calc(100% - 15px); overflow: hidden;”，隐藏标签的滚动条，关闭弹框会清除这个style，在弹框里面再打开二级弹框就会出现body标签上style没清理的问题导致滚动条消失。解决方法如下：在一级弹框ModalForm关闭后清理给body加的style，具体代码如下：<ModalForm

2021-04-29 13:49:54 3345 5

原创 Ant Design Upload listType=“picture-card“ 实现多图上传以及点击预览图片封装

用户可以上传图片并在列表中显示缩略图，当上传照片数到达限制后，上传按钮消失。点击图片打开图片预览弹框。在使用的地方引入组件，组件在传图后会返回图片数组。import React, { useState, useEffect } from 'react';import { Upload, Modal } from 'antd';import { PlusOutlined } from '@ant-design/icons';//上传前判断标准function beforeUpload(file)

2021-04-23 14:48:49 2365

原创 Vite实现原理详解-学习笔记

Vite是一个面向现代浏览器的更轻、更快的web应用开发工具，它是基于ECMAScript标准原生模块系统（ES Modules）实现，使用是为了解决Webpack在开发阶段使用webpack-server冷启动时间过长以及Webpack对html热更新慢的问题。Vite创建的项目就一个基于Vue3.0的应用，相比Vue CLI创建的项目少了很多配置文件和依赖。Vite创建的项目开发依赖Vite@vue/compiler-sfcVite是模拟实现的命令行工具，@vue/compiler-sfc用

2021-04-22 17:51:47 1131

原创 mkdir rm touch 常用命令行整理

mkdirmkdir [options] dirname-p 递归创建文件夹rmrm [options] filename/dirname-f: 强制删除文件或文件夹，即时文件夹为空-r: 递归删除文件或文件夹-I：删除文件或文件夹前需要确认一般-f和-r一起使用，强制递归删除指定的文件和文件夹Touch命令用来修改文件的访问时间、修改时间。如果没有指定时间，则将文件时间属性改为当前时间。当指定文件不存在，则touch命令变为创建该文件。touchtouch [optio

2021-04-22 17:12:37 81

原创在Rreact项目中使用nanoid生成唯一id，比unid轻便

yarn add nanoidimport {nanoid} from ‘nanoid’;

2021-04-22 17:06:42 819

原创安装taro报错permission denied, symlink ‘../lib/node_modules/@tarojs/cli/bin/taro‘ -＞ ‘/usr/local/bin/tar

安装taro命令npm install -g @tarojs/cli报如下错误：permission denied, symlink ‘…/lib/node_modules/@tarojs/cli/bin/taro’ -> ‘/usr/local/bin/taro’原因：权限不足直接sudo npm i -g @tarojs/cli可以解决

2021-04-22 16:53:56 686

原创 build报错解决Ineffective mark-compacts near heap limit Allocation failed - JavaScript heap out of memory

React+Ant Design+umi搭建的web后台 yarn run build 报如下错误：FATAL ERROR: Ineffective mark-compacts near heap limit Allocation failed - JavaScript heap out of memory 1: 0x1011c2ff5 node::Abort() (.cold.1) [/usr/local/bin/node] 2: 0x10009fbc9 node::Abort() [/usr/lo

2021-04-22 16:36:04 1807

原创 Ant Design ProTable 搜索框设置默认值

最近遇到一个需求，需要在ProTable搜索框的时间周期设置默认开始时间和结束时间，并调用接口返回数据显示。实现思路：创建formRef来设置ProTable里面搜索的默认值；通过moment来获取当前月的第一天和最后一天；通过formRef.current?.setFieldsValue赋值给created_at；通过formRef.current.submit()调用接口，渲染页面；实现该需求的必要代码：import React, { useState, useEffect, useR

2021-04-14 18:18:33 7119 13

原创 vue项目依赖升级报错处理

1.依赖升级后遇到的问题由autoprefixer版本引起的 warning:Second Autoprefixer control comment was ignored. Autoprefixer applies control comment to whole block, not to next rules解决方法：// 将样式中像下面的写法/* autoprefixer: off */..../* autoprefixer: on */// 改为 /* autoprefixer:

2021-03-20 14:20:40 2957

基于Ant Design Upload listType=“picture-card“ 实现多图上传以及点击预览图片的组件

空空如也