前端代码工具
文章平均质量分 69
xiaobing_hope
这个作者很懒,什么都没留下…
展开
-
Element implicitly has an ‘any‘ type because expression of type ‘string‘ can‘t be used to index type
当typescript编写代码时出现这个报错怎么办?例如如下代码及声明interface IJobData { generation?: {id: number; name: string; code: string;}[] publishing?: {id: number; name: string; code:string;}[]}const method = ['generation', 'publishing']const originJobData = { g原创 2022-03-29 19:54:52 · 7982 阅读 · 0 评论 -
web api - mutationObserver
MutationObserver接口提供了监听对DOM树所做更改的能力。是DOM3 Events规范的一部分。构造函数MutationObserver()创建并返回一个新的MutationObserver,它会在指定DOM发生变化时被调用。方法disconnect()阻止MutationObserver实例继续接收通知,直到再次调用其observe()方法,该观察者对象包含的回调函数都不会被调用observe()配置MutationObserver在Dom更改匹配给定选项时,通过其回调函数原创 2021-04-06 18:41:20 · 291 阅读 · 0 评论 -
浏览器缓存小结
浏览器缓存是前端优化的一个重要手段,缓存可以带来很多好处:减少冗余数据传输,节省带宽减轻服务器的请求负担,有缓存就可以减少向服务器发送请求资源从缓存中读取,无需向服务器发送请求再等待返回,加快了客户端的访问速度但缓存带了了一个问题,就是如果文件更新了,但用户访问时浏览器读取的是缓存资源,则用户就获取不到最新的页面,影响用户使用。这种情况如何解决呢?浏览器缓存主要是指http缓存,其机制是根据http报文的缓存标识进行相应的操作。状态码含义200 from memory c原创 2021-04-01 15:09:27 · 242 阅读 · 0 评论 -
前端性能优化 - 代码拆分和按需加载(减少bundle size)
代码拆分和按需加载的设计决定着工程化构建的结果,将直接影响应用的性能表现,因为合理的加载时机和代码拆封能够使初始代码体积更小,页面加载更快。按需加载和按需打包区别按需加载表示代码模块在交互需要时,动态引入;而按需打包针对第三方依赖库,及业务模块,只打包真正在运行时可能会需要的代码。按需打包的方式使用ES Module支持的Tree Shaking方案,在使用构建工具打包时,完成按需打包使用以babel-plugin-import为主的Babel插件,实现自动按需打包Tree Shaking实原创 2021-03-21 22:41:54 · 1441 阅读 · 0 评论 -
Monorepo + lerna & rush.js
Monorepomonolithic repository 单体式仓库,与之对应的是Multirepo(Multiple repository)Multirepo是比较传统的做法,即每个package都单独使用一个仓库来进行管理Monorepo是吧所有相关的package都放到同一个仓库进行管理,每个package独立发布。如React、Babel、VueMultiRepo方式允许多元化发展(各项目可以有自己的构建工具、依赖管理策略、单元测试方法)。虽然拆分子仓库、拆分子npm包是进行项目隔离的天原创 2021-03-15 17:11:52 · 1788 阅读 · 1 评论 -
rush.js基础
Rush方案多项目并存下,Symlink实现依赖只需一套,无重复安装提供项目间的自动link多线程构建多项目,加快构建速度自动检测有改动的项目,按配置产出版本号和changelogSymlink(符号链接)Rush一次性安装全部原始依赖在Root下的common/temp目录下,从该目录下提供Symlink给单个项目引用。Symlink只是提供指针,这样保证了对于依赖本身的更新会实时展现在项目中,且依然保有原有各项目的node_modules的结构Rush支持pnpmSymlink帮原创 2021-03-03 15:28:00 · 1667 阅读 · 0 评论 -
Typescript学习笔记四 - 第三方库的使用
第三方库的常见使用方式主要分为:script标签直接引入npm包引入(npm install 方式)其中npm库的形式又分为:有typescript版本的库,即声明文件和源码放在一起,则不需任何配置,直接使用源码中无声明文件,但@types里有对应的声明文件,可直接安装使用,不需自己手动写声明文件(npm install @types/jQuery)更推荐的是使用 @types 统一管理第三方库的声明文件。@types 的使用方式很简单,直接用 npm 安装对应的声明模块即可,以 jQ原创 2020-10-19 19:39:20 · 1418 阅读 · 0 评论 -
Typescript学习笔记三 --- 声明文件
声明语法declare var声明全局变量declare function声明全局方法declare class声明全局类declare enum声明全局枚举类型declare namespace声明全局对象interface和type声明全局类型export导出变量export namespace导出(含子属性的)对象export defaultES6 默认导出export =commonjs 导出模块export as namespaceUMD 库声明全局变量declare g原创 2020-10-15 18:03:10 · 1360 阅读 · 0 评论 -
git常用指令
修改本地分支名称git branch -m old_branch new_branch原创 2019-10-09 10:32:07 · 158 阅读 · 0 评论 -
npm-node相关 及 git常用命令
I. 临时使用npm源// 临时从淘宝的镜像源安装node-sassnpm --registry https://registry.npm.taobao.org install node-sassII. 持久使用npm源 // 设置npm的源为淘宝的镜像源npm config set registry https://registry.npm.taobao.or...原创 2017-07-03 14:31:19 · 806 阅读 · 0 评论 -
webpack学习
webpack简介:webpack的作用:通过commonjs的语法把所有浏览器需要发布的静态资源做相应的准备,比如资源的合并和打包。//app.jsvar module = require('./module.js');... module.dosth().. // 调用module依赖模块中的方法// module.jsexports.dosth = function(){原创 2017-01-09 11:13:26 · 499 阅读 · 0 评论 -
git常用命令
切换分支:git checkout name撤销修改:git checkout – file删除文件:git rm file查看状态:git status添加记录:git add file 或 git add .添加描述:git commit -m “miao shu nei rong”同步数据:git pull提交数据:git push origin name分支操作查看分支:g原创 2016-11-01 12:26:01 · 363 阅读 · 0 评论