- 博客(109)
- 资源 (3)
- 收藏
- 关注
原创 使用html2canvas实现快照,并添加元素到dom中,截图之后再删除
【代码】使用html2canvas实现快照,并添加元素到dom中,截图之后再删除。
2024-03-13 17:58:35 234
原创 封装axios并调用,添加请求拦截器和响应拦截器
创建文件src/service/axios.ts。在src/service/business.ts。直接在tsx文件可以直接调用。
2024-03-13 17:48:44 215
原创 将内容写入文件并下载文件
const content = JSON.stringify({'key': '测试'});//data为json格式的数据${${getRandom${getRandom'key' : '测试' });//data为json格式的数据 var blob = new Blob([ content ] , {
2024-03-13 17:41:20 177
原创 Umi + React + Ant Design Pro + TS 项目搭建
umijs/plugins 是 Umi 的官方插件集,包含了 valtio、react-query、styled-components、locale、access、qiankun 等大量插件,可让用户通过配置的方式一键开启和使用。@ant-design/pro-layout 是用于生成中后台布局的组件。(将运行时依赖和编译时依赖分别保存到 dependencies 和 devDependencies,这也是目前社区推荐的方式。antd 是基于 Ant Design 设计体系的 React UI 组件库;
2023-10-12 11:45:40 775
原创 使用antd-pro脚手架搭建react ts项目
在真实项目开发中,除了 Ant Design 这样的 UI 库,你可能会还会需要构建工具、路由方案、CSS 方案、数据流方案、请求库和请求方案、国际化方案、权限方案、Icons 方案,等等,才能完成一个完整的项目。我们基于业务场景的场景,推出了基于 React 的企业级应用框架 Umi,推荐你在项目中使用。Umi,中文发音为「乌米」,是可扩展的企业级前端应用框架,也是蚂蚁集团的底层前端框架,已直接或间接地服务了 10000+ 应用。
2023-10-12 11:23:09 639
原创 使用TypeScript编写npm package
tsdx 官方仓库:https://github.com/jaredpalmer/tsdx。
2023-03-01 20:02:39 306 1
原创 node启动之后内存占用过高解决方案
小编一开始也是一脸懵,这是为啥呢,一个空的node项目启动之后占用内存竟然有400多M查看项目占用cpu以及内存详情命令docker stats | grep node经过小编坚持不懈的找度年终于找到了跟小编出现差不多情况的人NodeJs内存占用过高的排查实战记录调研了一下小编尝试了一下减少进程数特别说明:小编这边用的是node的egg框架哦所以改变线程说很方便直接在启动命令后面加上–workers=2即可如下:"start": "egg-scripts --workers=2 st
2022-04-28 17:34:08 8203
原创 【无标题】
unable to access 'https://github.com/zlzbt/egg-socket-iodemo.git/': OpenSSL SSL_read: Connection was aborted, errno 10053git 提交报错解决方案git config --global http.sslVerify false
2022-02-09 10:52:03 109
原创 package.json license 开源许可证说明
Apache许可Apache许可证(Apache License),是一个在Apache软件基金会发布的自由软件许可证,最初为Apache http服务器而撰写。Apache许可证要求被授权者保留版权和放弃权利的申明,但它不是一个反版权的许可证。MIT许可MIT许可证之名源自麻省理工学院(Massachusetts Institute of Technology, MIT),又称“X条款”(X License)或“X11条款”(X11 License)。MIT是和BSD一样宽范的许可协议,作者只想.
2022-01-11 17:50:08 2895
原创 TS 报错 “umi“没有导出的成员‘xxx‘
主要是 ts 对 umi 的识别问题1:找到tsconfig.json文件查看引入的umi路径配置对不对"paths": { "@/*": ["./src/*"], "@@/*": ["./src/.umi/*"] }如果配置如上还是报错的话,直接重启ts即可vscode快捷键 Ctrl + Shift + p 输入restart TS Server完美解决,不报错啦...
2021-11-01 10:49:13 4428 3
原创 node 端打开本地应用
const cp = require("child_process");const execFile = cp.execFile;const iconv = require('iconv-lite');async upperMotor(body){ // cp.exec('start http://localhost:8000/') //打开默认浏览器 const path = 'D:\\Microsoft VS Code\\Code.exe'; execFile(pat
2021-08-27 10:40:24 731
原创 eventing-bus详解
事件总线 eventing-bus安装1.Node.jsnpm install --save eventing-bus2.Webpack:yarn add eventing-bus3.NPMnpm install --save eventing-bus订阅事件import EventBus from 'eventing-bus'const callback = (name) => { console.log(`Hello, ${name}!`) };EventBus.on("
2021-05-28 18:18:18 281 1
原创 Module build failed (from ./node_modules/source-map-loader/dist/cjs.js): TypeError: this.getOptions
错误图示如下执行 `npm run build` 的时候报错查了很久的资料只需要修改 webpack.config.js 中的rules修改如下
2021-05-18 15:05:33 3534 1
原创 新手搭建 ts + react + webpack 项目
新手搭建 ts + react + webpack 项目第一步安装依赖添加TypeScript配置文件开始编写代码创建一个webpack配置文件打包执行重点来了,小白千万别走第一步初始化项目结构:mkdir projcd projmkdir srccd srcmkdir componentscd ..npm ini安装依赖首先确保已经全局安装了Webpack。 npm install -g webpack现在我们添加React和React-DOM以及它们的声明文件到packa
2021-05-13 10:52:18 1765 7
原创 Cannot find module ‘webpack-cli/package.json‘
Cannot find module 'webpack-cli/package.json'
2021-05-13 10:23:30 1494
原创 Node.js配置npm全局模块路径和缓存路径
目的:可以改变这个路径,从而减少C盘的使用因为在执行npm install webpack -g 等命令全局安装的时候,默认会将模块安装在C:\Users\用户名\AppData\Roaming路径下的npm和npm_cache中。配置npm在安装全局模块时的路径以及缓存cache的路径在node.js安装目录下新建两个文件夹,node_cache和node_global。如下图所示。 在cmd中执行npm config set prefix "node_cache的路径",和npm conf
2021-05-12 19:17:15 3225 5
原创 Cannot find name ‘Set‘. Do you need to change your target library? Try changing the `lib` compiler o
错误提示:Cannot find name 'Set'. Do you need to change your target library? Try changing the `lib` compiler option to 'es2015' or later.错误截图 :错误解决方案:找到项目中tsconfig.json 将 target:es5 修改为 es6 如下图所示再次执行即可...
2021-05-12 18:28:53 1194
原创 Uncaught TypeError: renderer.incDisplayOrder is not a function
小编亲测了可以,又遇到同样困惑的小伙伴可以尝试一下 ^.^import{Texture}from'pixi.js'Uncaught TypeError: renderer.incDisplayOrder is not a function at Stage.Layer._preRender (pixi-layers.js:563) at Stage.Layer.render (pixi-layers.js:583) at Renderer.render (c...
2021-05-11 17:07:23 345 2
原创 React Native - 使用库 react-native-camera 调用摄像头扫描二维码以及条形码
1,react-native-camera介绍react-native-camera是一个第三方的开源库,我们可以通过它来调用设备的摄像头,从而实现拍照、或者录像功能。 react-native-camera功能强大,我们可以选择使用哪个摄像头、是拍照还是录像、是否录制声音、是否开启闪光灯、视图比例、拍摄质量、拍摄方向、触摸功能、条形码/二维码扫描等等。2,安装配置react-native init myrncamera2cd myrncamera2// A Camera compone..
2021-05-08 10:20:13 3222 7
原创 PIXI入门以及解决图片跨域问题
一:什么是PixiPixi是一个超快的2D渲染引擎。它会帮助你用JavaScript或者其他HTML5技术来显示媒体,创建动画或管理交互式图像,从而制作一个游戏或应用。它拥有语义化的,简洁的API接口并且加入了一些非常有用的特性。比如支持纹理贴图集和为精灵(交互式图像)提供了一个简单的动画系统。它也提供了一个完备的场景图,你可以在精灵图层里面创建另一个精灵,当然也可以让精灵响应你的鼠标或触摸事件。最重要的的是,Pixi没有妨碍你的编程方式,你可以自己选择使用多少它的功能,你可以遵循你自己的编码风格,或让
2021-04-28 16:21:31 2381 2
原创 `Camera` has no propType for native prop ... 解决方案
`Camera` has no propType for native prop `RNCamera.detectedImageInEvent` of小编在刚接触 react-native-camera 的时候,每一步都按照步骤来,终于android studio编译不报错了启动react-native run-android结果走到调用camera的时候竟然又开始报错了,小编找了好久的方案终于知道解决办法了!!!竟然要改动node 引入的包里面的内容去node_modules里面找到R..
2021-04-13 19:01:26 222
原创 vscode 设置 reactjs 识别为javascript react,便于格式化代码
一:全部设置识别为javaScript react1.文件 -> 首选项 -> 设置查找files.associations在工作区设置如下即可如图所示即可二:单独设置单个文件识别为javascript react解决格式化代码有问题在vscode中查看右下角点击javascript,出现可选语言,搜索javascript react 选中即可此时格式化代码就ok了 ^.^...
2021-04-08 14:02:06 1169 2
原创 常用的git命令(实时更新)
【安装Git时,您应该做的第一件事就是设置您的用户名和电子邮件地址。这很重要,因为每个Git提交都使用此信息,并且将它永久地烘焙到您开始创建的提交中】gitconfig--globaluser.name"zhangli"gitconfig--globaluser.email"zhangli@flashhold.com"1:git checkout -b <branchName> [创建并切换分支] 例子:git checkout -b feature ...
2021-04-02 10:24:13 168
原创 hooks初入门了解
什么是Hooks?总结起来就是hooks提供了在react函数组件中也可以使用类组件的state和生命周期的能力。为什么要用Hooks?组件嵌套问题之前如果我们需要抽离一些重复的逻辑,就会选择 HOC 或者 render props 的方式。但是通过这样的方式去实现组件,你打开 React DevTools 就会发现组件被各种其他组件包裹在里面。这种方式首先提高了 debug 的难...
2021-04-01 17:39:57 286
原创 flex 布局详解
一、Flex是Flexible Box的缩写,意为”弹性布局”,用来为盒状模型提供最大的灵活性。任何一个容器都可以指定为Flex布局。.box{display:flex;}行内元素也可以使用Flex布局。.box{display:inline-flex;}Webkit内核的浏览器,必须加上-webkit前缀。.box{display:-webkit-flex;/* Safa...
2021-04-01 17:38:30 163
原创 vscode 常用的插件
显示文件夹图标 --- Material Icon Theme 格式化插件 --- Beautify 切换中文插件 ---Chinese (Simplified) Language Pack for Visual Studio Code 快捷键在浏览器中打开 ---open in browser 彩虹括号 ---Rainbow Brackets git历史差异 --- Git History Diff ...
2021-04-01 17:28:18 450
原创 nodejs--框架学习(持续更新中)
一:exports和module.exports的区别exports方式使用方法是:exports.[function name] = [function name]moudle.exports方式使用方法是两者根本区别是: exports返回的是模块函数 module.exports返回的是模块对象本身,返回的是一个类 使用上的区别是: exports的方法可以直接调用 module.exports需要n...
2021-03-31 17:07:42 212
基于jQUery的拖拽
2020-11-11
react 一些基本的组成部分
2020-04-16
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人