- 博客(112)
- 资源 (1)
- 收藏
- 关注
RSS订阅原创 【无标题】
这些视图可以包括内嵌的 Webview，以便在插件中显示自定义的 Web 内容、UI 界面等。通过使用 viewsContainers"和 views 配置，可以创建自己的自定义视图和容器，将其添加到活动栏中，并与 Webview 结合以显示自定义的界面和内容。在插件的激活阶段，使用 vscode.window.registerWebviewViewProvider 方法来注册自定义视图的提供者。name：视图的名称，将在用户界面中显示。id：视图的唯一标识符，用于在扩展中引用这个视图。
2023-10-06 10:58:05
165
原创 【无标题】
如果 npm 包导出的是 ESM 规范的包，使用 module如果 npm 包只在 web 端使用，并且严禁在 server 端使用，使用 browser。如果 npm 包只在 server 端使用，使用 main如果 npm 包在 web 端和 server 端都允许使用，使用 browser 和 main其他更加复杂的情况，如npm 包需要提供 commonJS 与 ESM 等多个规范的代码文件，请参考上述使用场景或流程图。
2023-02-23 19:09:47
360
1
原创 node-sass按照失败
安装失败是因为默认是从国外线路下载，这些大家都是知道的，在网速不好的情况下，失败率很高。将镜像源设置为国内的淘宝之后，再随后执行。启动开发环境服务即正常，完美解决问题。切换镜像源，切换为国内的淘宝镜像源。命令后，报错了，报错的信息是。环境的错误信息，这是因为安装。安装失败，同时提示需要。
2023-02-16 13:38:58
437
原创 可以提高开发效率的vscode插件
我们在新建一个文件后，常常需要在文件头部加入默认注释，vscode中提供了一个的插件，可以帮助我们实现。在vscode extensions中搜索并按照koroFileHeader 插件 installl完成后，重启vscode打开vscode的设置(左下角管理-》设置)，搜索FileHeader搜索到内容后，点击三个中的任意一个“在setting.json中编辑”，编辑setting.json文件，加入以下内容：1.3，重启vscode这样在你创建类后会自动加上注解头。你也可以使用快捷方式加入。
2022-12-12 15:25:28
2908
原创 软考高项——各输入输出文件的含义
协议协议定义了启动项目的初衷。协议有多种形式 包括合同、谅解备忘录、服务品质 ，协议、协议书、意向书、口头协议、电子邮件或其他书面协议。通常为外部客户做项目时就用合同。
2022-09-02 09:21:21
1746
原创 软考高项——47个过程的输入、输出、工具技术汇总
制定项目章程制定项目管理计划指导与管理项目工作监控项目工作实施整体变更控制结束项目或阶段规划范围管理收集需求定义范围创建WBS确认范围控制范围规划进度管理定义活动排列活动顺序估算活动资源估算活动持续时间制定进度计划控制进度规划成本管理估算成本制定预算控制成本规划质量管理实施质量保证控制质量规划人力资源管理组建项目团队建设项目团队管理项目团队规划沟通管理管理沟通控制沟通规划风险管理识别风险实施定性风险分析实施定量风险分析规划风险应对控制风险规划采购管理实施采购控制采购结束采购识别干系人规划干系人管理管理干系人
2022-09-02 09:03:05
11921
1
原创 npm ERR! Cannot read properties of null (reading ‘package‘)
自己发布了一个脚手架 gxblognpm install gxblog -D 安装的时候提示下面错误npm ERR! Cannot read properties of null (reading 'package')改成npm install gxblog -g 后 问题解决
2022-07-07 10:01:33
5320
原创 优化进度条的N种方式
需求实现一个进度条，带有暂停和播放功能，效果图大致如下：功能不是很复杂，感觉也没有什么技术难度，我首先想到的是用一个定时器来实现这个功能，按钮可以控制定时器的开始和暂停，下面使用vue来实现第一版。定时器实现代码如下：<script>let timer， totalTime = 3000;export default { name: "Progress", data() { return { isPlay: false, progres..
2022-03-25 09:32:19
233
原创 webpack的Tree Shaking原来要这么使用才有效
先来了解一下commonJS和ES6模块导入导出使用方法。commonJSutils/index.jsexports.bar = 2module.exports = {foo: 9}exports.foo = 1;index.js中引入：const a = require('./utils/index')console.log(a) // {foo: 9}utils/index.jsexports.bar = 2exports.foo = 1;index.js
2022-02-16 11:07:23
2356
原创 为什么CommonJS和ES6可以混合使用?
1 node环境下运行新建一个文件夹testImport，创建webpack.config.js文件，创建src/index.js 内容为空。执行npm init安装第三方工具 npm install airspeed目录结构如下：index.js写入测试内容：import isEmptyObject from 'airspeed/isEmptyObject';// const isEmptyObject = require('airspeed/isEmptyObject
2022-02-16 11:06:28
2517
原创 教你发布一个按需加载的JS工具包
创建项目新建文件夹airspeed执行 npm init会生成一个简单的json文件：{ "name": "airspeed", "version": "1.0.0", "description": "", "main": "index.js", "scripts": { "test": "echo \"Error: no test specified\" && exit 1" }, "author": "", "license":
2022-02-16 11:05:23
1075
原创 es6解构赋值探坑
数组的解构不给默认值const [a] = [] // a undefinedconst [b] = [undefined] // b = undefinedconst [c] = [null] // c = null看结果并没有什么异常,往下看.给默认值const [a = 1] = [] // a 1const [b = 2] = [undefined] // b = 2const [c = 3] = [null] // c = null为什么es6undef
2022-02-16 11:03:38
688
原创 一步一步理解Generator函数的原理
Generator函数基本用法function* helloWorldGenerator() { yield 'hello'; yield 'world'; return 'ending';} var hw = helloWorldGenerator();Generator函数调用后生成的就是一个迭代器对象，可以通过调用迭代器的next方法，控制函数内部代码的执行。hw.next()// { value: 'hello', done: false } hw.next(
2022-01-10 12:06:31
774
原创 开发过程中踩过的坑
1 toFixedtoFixed() 方法可把 Number 四舍五入为指定小数位数的数字。先来看几个例子： const a2 = 0.0455; const a3 = 0.0453; const a4 = 0.044; console.log(a2.toFixed(2)); // 0.05 console.log(a3.toFixed(2)); // 0.05 console.log(a4.toFixed(2)); // 0.04方法返回正常结果，保留两位小数并且四舍五入
2022-01-07 12:10:32
2429
原创 几道烧脑又不得不掌握的JS面试题
第1题function a (b = c, c = 1) { console.log(b, c)}a()复制代码undefined 1解法上面的代码相当于下面的写法：function a (b = c, c = 1) { var b = c; var c = 1; console.log(b, c)}a()复制代码函数的参数实际上就是默认在函数内部声明了变量，默认值会在声明的时候被赋值。又因为存在变量提升，所以不会报错，b是undefined，
2022-01-05 12:08:19
698
原创 商城小程序开发问题总结
一 样式1 不支持通配符 *app.wxss/*在微信小程序中不支持通配符'*'*/page,view,text,swiper,swiper-item,image,navigator{ padding: 0; margin: 0; box-sizing: border-box;}2 支持变量app.wxss/* 主题颜色 通过变量来实现 1 less 中 存在 变量这个知识 2 原生的css和wxss也是支持 变量 */ page{ ...
2021-10-28 17:20:22
397
原创 深入理解性能优化方案
##一、浏览器渲染引擎###主要模块*一个渲染引擎主要包括：HTML解析器，CSS解析器，javascript引擎，布局layout模块，绘图模块*HTML解析器：解释HTML文档的解析器，主要作用是将HTML文本解释成DOM树。*CSS解析器：它的作用是为DOM中的各个元素对象计算出样式信息，为布局提供基础设施*Javascript引擎：使用Javascript代码可以修改网页的内容，也能修改css的信息，javascript引擎能够解释javasc...
2021-06-10 20:20:38
474
转载 浏览器——HTTP1.0、HTTP1.1 和 HTTP2.0 的区别
一、HTTP的历史早在 HTTP 建立之初，主要就是为了将超文本标记语言(HTML)文档从Web服务器传送到客户端的浏览器。也是说对于前端来说，我们所写的HTML页面将要放在我们的 web 服务器上，用户端通过浏览器访问url地址来获取网页的显示内容，但是到了 WEB2.0 以来，我们的页面变得复杂，不仅仅单纯的是一些简单的文字和图片，同时我们的 HTML 页面有了 CSS，Javascript，来丰富我们的页面展示，当 ajax 的出现，我们又多了一种向服务器端获取数据的方法，这些其实都是基于 HTT
2021-05-26 10:39:26
816
原创 【前端性能优化】长列表优化
一、什么是长列表？前端的业务开发中会遇到一些数据量较大且无法使用分页方式来加载的列表，我们一般把这种列表叫做长列表。完整渲染的长列表基本上很难达到业务上的要求的，非完整渲染的长列表一般有两种方式：懒渲染：这个就是常见的无线滚动的，每次只渲染一部分（比如10条），等剩余部分滚到可见区域，就再渲染一部分。 可视区域渲染：只渲染可见部分，不可见部分不渲染。虚拟列表就是采用的可视区渲染方式优化二、虚拟列表实现原理虚拟列表（Virtual List），是一种长列表优化方案，是可视区渲染列表。其两个重要
2021-05-12 15:34:00
7336
1
原创 一步一步 的理解设计模式
本文借鉴书籍《JavaScript设计模式 张容铭》写在认真阅读n遍以后。1，灵活的设计你的代码加入有这样一个需求，需要你写一个注册登录页，要求验证邮箱，验证密码，验证手机号。最没有思考的实现方式：function checkPhone(params) { }function checkMail(params) { }function checkPassword(params) { }功能划分清晰，一目了然，但是有个问题，你创建了很多全局变量，假如这是
2021-04-30 16:53:53
186
2
原创 面试题总结-虚拟列表和tcp
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>lo...
2021-02-23 10:19:59
266
原创 面试题总结 - 函数 深拷贝 驼峰转换
1 JSON key 驼峰转换实现一个转换函数covert，将JSON对象的下划线keys（{a_jh_dhs: 99}）转化为驼峰形式 {aIhDhs: 99}function getCase(obj) { const reg = /_(.)/g function keyToCase(str) { if(typeof str !== 'string') return '' return str.replace(reg, (match, $) => { .
2021-01-29 18:53:46
431
原创 浏览器——HTTP协议
超文本传输协议，可以传递文本处理客户端和服务端的通信http请求/http返回返回一些网页，json，xml，提交表单纯问文本，无状态应用层用TCP/IP信息是纯文本传输无状态，每次请求独立，请求间互不影响浏览器提供了手段维护状态（Cookie，Session，Storage）HTTPS 安全超文本传输协议postmanwhistleHTTP常见请求头GET- 从服务器获取资源POST-在服务器创建资源P...
2021-01-26 15:17:58
568
原创 setState异步、同步与进阶
如何使用setState在 React 日常的使用中，一个很重要的点就是，不要直接去修改 state。例如：this.state.count = 1是无法触发 React 去更新视图的。因为React的机制规定，一个state的更新，首先需要调用 setState 方法。this.setState({ count: 1})复制代码这样便能触发重新渲染。稍有经验的开发者会知道，setState 方法其实是 “异步” 的。即立马执行之后，是无法直接获取到最新的 state 的，需...
2020-11-30 21:31:20
93
原创 OSI七层模型
七层模型，亦称OSI（Open System Interconnection ）Model，开放式系统互联。应用层 提高高级API，定义了网络主机提供的方法和接口（应用协议，高级协议等），往往是直接对应用户行为。例如：HTTP，FTP，SMTP。展示层 该层可提供一种标准表示形式，用于将计算机内部的多种数据格式转换成通信中采用的标准表示形式。如：序列化，压缩和加密，确保数据发送出去后，可以被接受者理解。会话层 会话层就是负责建立、管理和终止表示...
2020-11-17 10:42:53
421
原创 async/await函数的使用和实现原理
实现一个简单的async/await如上，我们掌握了Generator函数的使用方法。async/await语法糖就是使用Generator函数+自动执行器来运作的。 我们可以参考以下例子// 定义了一个promise，用来模拟异步请求，作用是传入参数++function getNum(num){ return new Promise((resolve, reject) => { setTimeout(() => { resolve(n
2020-11-14 14:11:18
493
原创 Generator函数的使用和原理
function * demo() { console.log('Hello' + (yield)); // OK console.log('Hello' + (yield 123)); // OK}var d = demo()console.log(d.next())console.log(d.next())console.log(d.next())function *flat(arr) { for(var i = 0; i < arr.length; i ++).
2020-11-13 18:57:49
779
转载 浏览器——缓存机制
目录 1. DNS 缓存 // 虽说跟标题关系不大,了解一下也不错 2. CDN 缓存 // 虽说跟标题关系不大,了解一下也不错 3. 浏览器缓存 // 本文将重点介绍并实践 DNS 缓存什么是DNS全称 Domain Name System ,即域名系统。万维网上作为域名和IP地址相互映射的一个分布式数据库，能够使用户更方便的访问互联网，而不用去记住能够被机器直接读取的IP数串。DNS协议运行在UDP协议之上，使用端口号53。DNS解析简单的说,通过域名,最终得
2020-11-13 15:39:41
952
1
原创 深入浅出webpack-打包优化
10 代码分割多个html文件，多个入口var extractTextCss=require('extract-text-webpack-plugin');var htmlWebpackPlugin=require('html-webpack-plugin');module.exports= { mode:'production', entry:{ app:"./src/app.js", app2: "./src/app2.js" }, output:{ path:_
2020-10-13 20:49:07
1985
原创 深入浅出webpack -- loader和plugin原理及区别
loader原理概念loader就像一个翻译员，能将源文件翻译后输出新的结果，并且一个文件可以链式的经过几个翻译员。以.scss文件为例子：先将.scss文件内容交给sass-loader翻译为css 在将翻译后的css交给css-loader,找出css中依赖的资源，压缩css 再将css-loader输出的内容交给style-loader,转化为通过脚本加载的JavaScript代码const path = require('path');var HtmlWebpackPlug
2020-10-12 20:32:21
4243
1
原创 深入浅出webpack -- webpack-dev-server 常用配置及原理
一、初始化项目《深入浅出webpack-热更新》二、devServer常用的配置1、host: '0.0.0.0'devServer.host配置项用于配置DevServer服务监听的地址，只能通 过命令行参数传入。host的默认值是 127.0.0.1，即只有本地可以访问DevServer的HTTP服务。若想让局域网中的其他设备访问自己的本地 服务，则可以在启动DevServer时带上--host 0.0.0.0。2、opendevServer.open用于在DevServer启动
2020-10-09 15:37:06
1917
原创 深入浅出webpack-热更新
什么是热更新？使用vue或者react框架开发的时，只要项目启动了，无论修改js代码还是css代码，浏览器都会更新，可能有很多童鞋会认为这就是热更新，实际上这个你看到的并不是热更新，只是模块的刷新。下面通过代码来认识一下什么是模块刷新？什么是热更新？初始化项目npm inittouch index.htmltouch app.jsnpm i webpack webpack-cli webpack-dev-server --D注意：这里使用的是webpack 4.x，如果直接使用
2020-10-09 09:37:52
388
原创 每次打开Terminal都需要source bash_profile问题
mac电脑系统版本10.15.5在.bash_profile文件中写入下面内容export NVM_DIR="$HOME/.nvm"[ -s "$NVM_DIR/nvm.sh" ] && \. "$NVM_DIR/nvm.sh" # This loads nvm[ -s "$NVM_DIR/bash_completion" ] && \. "$NVM_DIR/bash_completion" # This loads nvm bash_completion
2020-09-16 20:37:24
5255
2
原创 TypeScript -声明文件
遇到问题：开发超五card过程中，使用TypeScript写代码，因为项目中需要引入moment，来处理日期格式问题。像往常一样下载引入：tnpm i moment --saveimport * as moment from 'moment';引入后发现有红色波浪线，但是页面并没有报错前端第三方库大多都是非 TypeScript 库，基本上都是使用 JS 编写的，在 TS 中使用非 TS 编写的第三方库，需要有个 xx.d.ts 声明文件。引入声明文件后，就能获得对应的代码.
2020-07-06 18:51:59
1531
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人