- 博客(91)
- 收藏
- 关注
RSS订阅原创 npm全局安装包，命令找不到
背景：使用npm install webpack -g命令之后，执行webpack出错：webpack command not found解决：查看全局有什么path变量，存在path变量才能全局使用这个命令echo $PATH为webpack添加全局命令：export PATH=$PATH:在$PATH: 后面添加路径。路径来源于安装webpack成功之后的提示，类似于下面代码的...
2021-05-13 15:09:17
1329
原创 Entry Task Black Cat
历时n天，终于把entry task做完了。很多个第一次第一次用cli4搭建项目之前用的版本好像是2？，自己快要一年都没有写vue项目了。vue变化真大第一次用ts+vue写项目。算是ts的初体验吧。繁琐的类型定义。虽然真的会规避掉很多错误。但是要写多很多代码也是真的。漏写了就红杠杠警告！心累。ts+vue的项目除了ts语法，vue写起来也有一些不同。第一次如此严格的eslintes...
2020-07-18 13:04:37
1113
原创 封装svg组件
svg图标的使用基于这次项目的图标使用本地的svg图片。普通的使用方式<svg :class="svgClass" aria-hidden="true"> <use :xlink:href="iconName" /></svg>避免每次写这三行代码，封装一个svg组件！important 本次项目基于cli41⃣️ 项目文件夹结构...
2020-07-18 11:49:52
531
原创 配置环境
通过cmd窗口，安装tsnpm install -g typescript安装后，输入tsc -v检验ts版本，检视是否安装成功vs code新建一个ts文件配置ts->js的自动编译① vs code打开ts文件所在的文件夹，② cmd跳转ts文件所在的文件夹的路径，输入 tsc --init生成了tsconfig.js配置文件③ 修改配置文件的"outDir"即...
2020-06-08 18:18:32
204
原创 this指向补充【from 虾皮的鞭打】
字节和虾皮的两道this指向题目虾皮var a = 5var obj = { a: 10, b: () => { (function () { console.log(this.a) // window }).call(this) // window }}obj.b() // 5var a = 5var obj = ...
2020-03-26 23:58:59
138
原创 2020-03-20被字节面试官“吊打”的一次体验
标题纯粹哗众取宠，内容才是干货1. meta标签的作用meta标签的功能真的很多多很多了。下面列举我自己感觉会比较常用的一些<meta> 标签提供关于 HTML 文档的元数据。页面不可见，但是机器可读。① 最基本的功能：声明文档使用的字符串编码(utf-8中文编码)<meta charset="utf-8">②SEO优化<!-- 页...
2020-03-21 16:31:09
197
原创 实战视频流
视频流好处：边加载便播放防盗链：避免video标签被盗取src链接，避免被站外被恶意访问视频资源先实现了视频流再实现防盗链。视频流实现的关键是，视频文件的流式读取。参考了这篇文章https://blog.csdn.net/liuyaqi1993/article/details/76560401前端方面：把视频请求放在video标签src觉得src这个标签挺神奇的。不...
2020-03-13 16:45:46
213
原创 color together中颜色扉页问题
图片.png图片.png实现这两个页面要求：当第一页内容块高度大于屏幕高度时，颜色扉页的高度=内容块高度。反之，颜色扉页的高度=屏幕高度动态获取内容块高度可以使用boundingClientRect这个方法。但是发现这个方法在此处得到的高度并不准确。经过对比发现，差别的地方是在图片位置（封装了lazyload组件）。（每一张图片都是不一样高度的...
2020-03-03 23:44:24
171
原创 js版本替换字符串空格的几种方法
简单版function replaceSpace(str){ let a= str.replace(/\s/g,'%20') return a}简单版2function replaceSpace(str){ let a= str.split(" ") let b= a.join('%20') return b}3.如果明确要求只能在源...
2020-02-11 21:18:59
1942
原创 webpack属性
为引入包起别名resolve: { alias:{ // 代号 bootstrap: 'bootstrap/dist/css/bootstrap.css' }}// home.jsimport 'bootstrap'// 映射到'bootstrap/dist/css/bootstrap.css'这个路径配置server添加源码映射方...
2019-12-30 13:01:18
394
原创 webpack跨域
webpack数据获取问题实践新建server.js写一个简单的后台服务let express = require('express')let app = express()app.get('/user', (req, res) => { res.json({ name: 'yuqin' })})app.listen(3000, () => ...
2019-12-30 13:00:49
257
原创 webpack常用loader
postcss -loader打包css样式，自动添加前缀直接在匹配css文件下，添加使用这个loader就可以了注意：postcss-loader要在css-loader下面即先添加前缀再打包babel-loader @babel/core @babel/preset-enves6转es5yarn add babel-loader @babel/core @bab...
2019-12-30 12:54:52
845
原创 webpack打包优化
tree shaking使用import导入的包，在生产环境下自动去除包内没有引用的代码。这是webpack打包自带的优化import是es6引入规范（所以记得要装babel）require是common.js引入规范scope hosting转自在bundle.js文件// module-a.jsexport default 'module A'// ent...
2019-12-30 12:39:18
553
原创 webpack抽离公共代码和热更新
抽离公共代码module.exports里配置属性对象optimization:{ //执行是自上而下的 splitChunks:{ //分割代码块 cacheGroups:{ //缓存组 // 抽离自定义模块 common:{ //抽离出来代码自动创建在名为common开头的文件中 chunks: 'in...
2019-12-30 11:28:50
600
2
原创 webpack打包多入口文件
//多入口 entry: { home: './src/home', other: './src/other' },output: { filename: '[name].js', path: path.resolve(__dirname, 'dist') },plugins: [ new htmlWebpackPlugin({...
2019-12-30 11:15:32
1639
原创 webpack常用plugin
webpack-merge合并两个配置文件，他是webpack插件，引入webpack模块即可使用应用场景：区分开发环境/生产环境https://www.cnblogs.com/dengyao-blogs/p/11598431.html简要步骤：安装webpack-merge插件公共属性配置：新建一个config文件dev：开发环境配置production：生产环...
2019-12-29 21:13:02
1110
原创 【webpack】从零开始建项目和打包配置
从零开始建项目和打包配置1.npm install yarn -gyarn是什么2yarn init -y初始化项目其实就是新建了package.json文件，以后项目安装的依赖都会记录到这个文件3.安装webpack，webpack-cliyarn add webpack webpack-cli -D4.新建一个src目录，src里存放我们的项目文件在src目...
2019-12-29 16:50:31
152
原创 npm命令收藏
npm init 初始化项目（多了package.json记录项目依赖的一些信息）npm init -y 跳过会话窗口初始化一个项目替换淘宝镜像npm config set registry https://registry.npm.taobao.org// yarnyarn config set registry https://registry.npm.taobao...
2019-12-29 11:27:18
110
原创 模块引入
模块引入是node一个重要的知识点导出方式：方式1：module.exports={ userName:'Jack', sayHello:function(){ return this.userName }}方式二：exports.userName= 'Jack'exports.sayHello=function(){ ...
2019-11-20 17:42:35
146
原创 css中的百分比相对于谁？
相对于参照物的//相对于第一个有定位属性的元素position:absolute;top:10%;相对于自身的position:relative;top:10%;border-radius:50%;background-size:10%;transform:50%;text-indent:10%;//相对自身的font-sizeline-heig...
2019-11-19 21:24:28
619
原创 二分法思路总结
二分的思想的挺简单的，一开始觉得要考虑很多边界情况。但其实不然，考虑这些边界情况并不会改善算法的时间复杂度。深刻体会，对于计算机来说，少计算一次两次有什么区别呢。真正影响到执行时间的是内部if，else语句的出口。以及时间复杂度，是一种数量级的增长，而不是一次两次。如果一定要用if else，那么看是否能用？：表达式代替。首先二分法的思想它是一种分治的思想。适用于相对有序的...
2019-11-06 12:37:19
599
原创 爬楼梯
之前使用的递归法重复计算太多，不能通过时间限制var climbStairs = function(n) { if(n==1) return 1 if(n==2) return 2 else{ return climbStairs(n-1)+climbStairs(n-2) }}今天补一个时间复杂度没那么高的方法var cl...
2019-10-28 17:33:37
62
原创 使用git flow
企业开发一般使用git flow流程除了master分支，还会有一个develop分支，表示随时都会上线的版本。所以一般的流程是，先新建分支，自己的分支合并develop分支今天学到的命令还挺多。git add [文件名] 只提交文件名文件git status 查看git状态，有什么文件需要add，commit，push等git log 查看历史版本git reset...
2019-10-17 15:33:42
83
原创 【Leetcode】5.最长回文字符串
做笔试题的时候没做出来，但是基本思路想到了思路：中心拓展法单数情况：判断一个字符两边字符是否相等，相等则继续拓展比较。不相等就可以进行当前字符串的截取双数情况：判断str[i]==str[i+1]?相等则继续拓展比较注意substr截取字符串的参数。下次不能for循环套while循环，容易超时。var longestPalindrome = function (s) {...
2019-10-13 13:04:40
74
原创 单例模式
接触到的第一个设计模式——单例模式是什么？保证一个类只有一个实例，并提供一个访问它的全局访问点使用闭包实现function Person() { this.name = 'lucas'}const getSingleInstance = (function(){ var singleInstance return function() { ...
2019-10-09 09:52:42
64
原创 Node创建子线程监听文件修改
坑啊node新手看《node.js开发实战》，刚开始照着书本打，就出现了坑！真是气人'use strict'const fs = require('fs')const spawn = require('child_process').spawnconst filename = process.argv[2]//arguments vector的简写，它的值是数组,看下面打...
2019-10-07 19:12:31
258
原创 理解浏览器与客户端通信过程
有以下几个场景说明浏览器与客户端通信过程1.浏览器上输入url之后发生了什么？①进行域名解析为ip地址（先查找本地host表然后查找dns解析器缓存，是否有这个域名的映射，没有就进行路由查找）②建立tcp连接③发送http请求④返回http响应⑤建立dom树和cssdom树，进行页面渲染⑥断开或者保持连接2. ajax技术3.用户登录过程① 用户输入账号密...
2019-10-03 12:06:06
850
原创 js线程
我们都能说出js是单线程的但是为什么js是单线程的呢？？JavaScript 的主要用途是与用户互动，以及操作 DOM。这决定了它只能是单线程，否则会带来很复杂的同步问题。比如两个线程同时操作了dom，浏览器渲染应该听谁的呢？为了利用多核 CPU 的计算能力，HTML5 提出 Web Worker标准，允许 JavaScript 脚本创建多个线程，但是子线程完全受主线程控制，...
2019-10-03 11:18:21
150
原创 浏览器线程
一个浏览器通常由以下几个常驻的线程：渲染引擎线程，负责页面的渲染js引擎线程，负责js的解析和执行定时触发器线程，处理setInterval和setTimeout事件触发线程,处理DOM事件异步http请求线程，处理http请求要注意的是渲染引擎和js引擎线程是不能同时进行的。渲染线程在执行任务的时候，js引擎线程会被挂起。因为若是在渲染页面的时候，js处理了DOM，...
2019-10-03 10:11:40
69
原创 运算符那些事
转自别人的解释输出以下代码运行结果1 + "1"2 * "2"[1, 2] + [2, 1]"a" + + "b"1 + "1"加性操作符：如果只有一个操作数是字符串，则将另一个操作数转换为字符串，然后再将两个字符串拼接起来所以值为：“11”如果操作数是数字加undefined,那么结果就是NAN如果操作数是两个字符串，就执行字符串相连操作2 * "2"乘...
2019-10-03 09:06:51
53
原创 闭包
作为js的三座大山之一的闭包。闭包原理：函数作用域，垃圾回收机制，作用域链一个一个来函数作用域是什么呢？首先，js的作用域分为函数作用域和静态作用域静态作用域指的是一段代码，在它执行之前就已经确定了它的作用域，简单来说就是在执行之前就确定了它可以应用哪些地方的作用域(变量)。动态作用域–函数的作用域是在函数调用的时候才决定的调用函数时创建函数作用域，函数执行完毕以后...
2019-10-03 09:04:27
40
原创 扁平化数组
第一次遇到数组扁平化已经是在3k游戏的笔试题里，当时是用了递归的方法。因为对一些数组方法，字符串方法十分的不熟练扁平化数组的核心都是，遍历数组元素，遇到数组就拆，不是数组就加进去。var arr = [1, [2, 3, [4, 5]]] console.log(bianpinghua(arr))toString()+split()先把数组转为字符串，然后通过，分割成数...
2019-10-01 11:52:40
84
原创 【Leetcode】7.整数反转
这道题有两个解题思想：整数包括了复数噢，同时反转的时候需要注意，反转后数据溢出问题。还有使用print或者console时，输出整数如果太大的话，就会产生误差，所以需要把整数转为字符串进行输出第一：把整数转为字符串，正则匹配数字部分，然后使用reserve方法进行反转。第二：通过数学方法解析出整数的个十百...位，然后存到数组里面，使用数组方法pop出来，进行字符串拼接。...
2019-10-01 11:03:25
89
原创 【Leetcode】3. 无重复字符的最长子串
javascript版本思路：滑动窗口思想当指针向右滑动时，判断前面的字符是否有和现在指针所指的一样。利用str.indexOf()==i（当前指针下标）如果是则前面的字符串不存在相同的字符。如果存在相同的，滑动窗口左边就要移到第一个重复字符的右边，继续向右遍历，看遍历指针处字符是否与窗口内字符有重复，有的话，窗口左边继续移到该重复字符处。继续遍历以下为解题代码时间复杂...
2019-09-30 22:15:10
68
原创 js强制类型转换
今日地铁看书总结强制类型转换toString()其他数据类型转化为字符串的方法注意，数组重写了toString（）方法。对于JSON.stringfy()不安全值有undefined,null,function,symbol，循环引用对象,转化他们结果为undefinedJSON.stringfy(function(){}) //undefined当使用JSON.s...
2019-09-28 21:29:12
128
原创 安装vue脚手架遇到的问题
先来复习一下命令如果之前已经npm install --global vue cli就不用再再次进行安装在那里安装呢？在真正项目的上一层文件夹直接用vue init webpack myproject（你的项目名称）进行安装即可遇到的问题：npm install出现: Unexpected end of JSON input while parsing near以及提示...
2019-09-28 13:01:51
1109
原创 color Togrther项目总结
相似颜色1.比较颜色相似时，先比较色相范围，筛选出一定范围。再使用rgb权值公式进行比较2.得到相似颜色之后，需要寻找颜色所在色卡，因为颜色在色卡内排布的比较规律。则可以用二分法，不断分割遍历区间。思路：是否在头/尾/中间的颜色区间中，是则return。不是则继续二分区间，继续比较。在写二分查找的时候遇到这么一些问题:①二分法有两种写法，一种是while循环，一种...
2019-09-28 12:30:56
62
原创 【Letcode】两个链表相加
给出两个 非空 的链表用来表示两个非负的整数。其中，它们各自的位数是按照 逆序 的方式存储的，并且它们的每个节点只能存储 一位 数字。如果，我们将这两个数相加起来，则会返回一个新的链表来表示它们的和。您可以假设除了数字 0 之外，这两个数都不会以 0 开头。示例：输入：(2 -> 4 -> 3) + (5 -> 6 -> 4)输出：7 ->...
2019-08-28 18:33:50
67
原创 跨端开发——响应式布局
响应式布局和自适应布局，听着很像，他们是有什么区别呢？用自己的话总结就是：响应式布局就是根据显示屏幕的大小，调整css方案，只需要一套响应式的布局设计方案即可。自适应布局就是根据显示屏幕大小，请求服务器相应的css方案，服务器返回方案进行显示。需要多套布局设计方案。响应式布局和自适应布局详解浅谈响应式Web设计与实现思路 ...
2019-08-27 10:18:14
218
原创 继承
当我们通过obj.a访问a属性时，实际上调用[[Get]]操作在自身和原型链上查找。当我们通过obj.a=2对属性赋值时，有以下几种情况：①a是该对象实例属性，该语句效果，直接修改属性值或者创建这个属性，并赋值②a既是原型属性，也是实例属性，那么obj会屏蔽原型链上的同名属性③a只是原型属性如果a不是只读属性，obj上会创建新的a并赋值，a是屏蔽属性如果a是只读属性，那...
2019-08-25 09:21:49
53
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人