create-react-app 3.4.1版本源码解析之执行流程

2020-05-13
阅读 1 分钟
1.6k
create-react-app脚手架入口是packages/create-react-app/下的index.js文件。那么运行该文件,大概的执行流程是怎样的呢?可以通过以下流程图来大致看一下。流程图只画出了大概的流程。

package.json配置项详解

2020-04-10
阅读 5 分钟
12.5k
package.json文件就是一个JSON对象,该对象的每一个成员就是当前项目的一项设置。npm install命令根据这个配置文件,自动下载所需的模块,也就是配置项目所需的运行和开发环境。

windows下create-react-app 升级至3.3.1版本踩坑记

2020-02-12
阅读 2 分钟
4.8k
电脑原先使用npm install -g create-react-app命令全局安装过,根据文档先全局卸载npm uninstall -g create-react-app,然后采用npx create-react-app my-app创建项目。然而,项目创建完后,却只生成了node_modules,package.json,package_lock.json或yarn.lock这几个文件夹,同时报错:

统一团队协作的代码风格

2019-12-27
阅读 3 分钟
4.7k
目前在梳理团队项目时,发现很多代码不规范的问题,各式命名杂糅,风格迥异,看着就像一锅大杂烩,不利于代码的可读及维护。于是决定引入工具,采用eslint+prettier+husky+lint-staged方式,强制代码格式的统一。因为项目是使用create-react-app建立,因此在该脚手架上进行修改。

document.createElementNS

2019-12-11
阅读 2 分钟
7.4k
使用document.createElement创建svg元素时,会发现一个诡异的现象,svg元素无法在页面上显示,但是通过调试器,可以看到该svg元素的存在。

create-react-app 2.1.8版本自定义配置

2019-04-11
阅读 2 分钟
4.3k
1.yarn add @babel/plugin-proposal-decorators --dev2.package.json文件的babel配置项中,添加

windows下mongodb的安装与配置

2018-05-19
阅读 2 分钟
8.8k
官网下载mongoDB:[链接]windows7 64位安装3.6版本会发生安装到一半后,就一直无法安装下去的问题(可能是因为安装时勾选了MongoDB Compass的原因,在安装时取消这个即可),可在以下网址下载其他版本进行安装:[链接]

JS中的new和作用域链

2017-11-09
阅读 2 分钟
2k
如果构造函数返回了一个“对象”,那么这个对象就是new出来的结果。如果构造函数没有返回对象(即返回一个非对象值,例如数值,或者无返回值),那么new出来的结果为obj对象。一般情况下构造函数不返回值,除非你想要覆盖正常创建的对象(即obj)。

vue-webpack-boilerplate里面各文件解析

2017-10-19
阅读 2 分钟
3.1k
在使用 Git 进行版本控制的时候,有些文件是无需纳入 Git 管理的,通常都是些自动生成的文件,像日志或者编译过程中创建的文件。我们可以创建一个名为 .gitignore 的文件,列出要忽略的文件来解决这个问题。关于 Pattern 规则,可以查看 git 的相关文档:[链接]

Vue单元测试---Karma+Mocha+Chai实践

2017-09-06
阅读 4 分钟
8.3k
Chai:一个测试断言库,提供了更好的断言语法。所谓断言,就是对组件做一些操作,并预言产生的结果。如果测试结果与断言相同则测试通过。Chai断言库中,to be been is that which and has have with at of same but does这些语言链是没有意义的,只是便于理解而已。

使用json-server来模拟REST API

2017-08-30
阅读 3 分钟
4.2k
在前端开发中,如果后端接口还没有提供,前端拿不到数据,可能就没法继续写一些交互行为的代码。这一问题可通过json-server来很好地解决。本文主要讲如何将json-server和webpack进行整合,基于vue-webpack-boilerplate。

JavaScript之Object

2017-08-21
阅读 11 分钟
2.2k
Object构造函数创建一个对象包装器。如果给定值是 null or undefined,将会创建并返回一个空对象,否则,将返回一个与给定值对应类型的对象。布尔值、数值、字符串分别转成对应的包装对象时,它们的原始值都在包装对象的内部属性[[PrimitiveValue]]上面。只有字符串的包装对象,会产生可枚举属性。

webpack学习笔记

2017-08-15
阅读 2 分钟
1.1k
2.resolve.alias:创建 import 或 require 的别名,来确保模块引入变得更简单。取别名时在给定对象的键后的末尾添加 $,表示精准匹配,详见文档

VSCode安装与配置

2017-08-11
阅读 3 分钟
23.7k
安装 在vscode官网下载版本安装。 配置 常用插件 HTML Snippets: H5代码片段以及提示 Auto Close Tag : 匹配标签,关闭对应的标签。 Auto Rename Tag : 当修改HTML/XML标签时,会自动修改与之对应的开始/结束标签。 vscode-icon:让 vscode 资源树目录加上图标。 Path Intellisense:路径智能提示。 Eslint:代码检查。...

windows下安装node.js

2017-06-30
阅读 3 分钟
7.8k
2.测试node是否安装完成:输入"cmd" 打开dos命令行窗口。在dos命令行窗口中输入node -v检测node是否安装成功,输入npm -v检测npm是否安装成功。安装成功出现以下画面:

npm install、npm init、npm update、npm uninstall和package.json

2017-06-30
阅读 2 分钟
25.2k
npm install <package_name>:这个命令将在当前目录中创建node_modules目录(如果尚不存在),并将该软件包下载到该目录。该命令默认本地安装。

ES6学习笔记5-编程风格、二进制数组和SIMD

2017-06-08
阅读 20 分钟
2.2k
编程风格 块级作用域 let 取代 var,在let和const之间,建议优先使用const,尤其是在全局环境,不应该设置变量,只应设置常量。 字符串 静态字符串一律使用单引号或反引号,不使用双引号。动态字符串使用反引号。 {代码...} 解构赋值 使用数组成员对变量赋值时,优先使用解构赋值。 {代码...} 函数的参数如果是对象的成...

ES6学习笔记4-Proxy、Reflect、Decorator、Module

2017-06-05
阅读 17 分钟
2.7k
Proxy 这个词的原意是代理,用在这里表示由它来“代理”某些操作,可以译为“代理器”,即用自己的定义覆盖了语言的原始定义。ES6 原生提供 Proxy 构造函数,用来生成 Proxy 实例。

ES6学习笔记3-Set和Map、Promise、Iterator、Generator、async 、Class

2017-06-03
阅读 32 分钟
3.6k
新的数据结构Set类似于数组,但是成员的值都是唯一的,没有重复的值。Set 本身是一个构造函数,用来生成 Set 数据结构。接受一个数组(或类似数组的对象)作为参数,用来初始化。

ES6学习笔记1--let和const命令、解构赋值和Symbol

2017-05-16
阅读 7 分钟
1.8k
let和const命令 let命令 在声明所在的块级作用域内有效。 只要块级作用域内存在let命令,它所声明的变量就“绑定”(binding)这个区域,不再受外部的影响。 在同一个作用域内,不允许重复声明变量。var可以重复声明。 let命令不存在变量提升。var命令会发生”变量提升“现象。因此使用let命令声明的变量,凡是在声明之前就...

__proto__和prototype

2017-05-09
阅读 3 分钟
2.6k
每个对象都有一个__proto__(前后各两个下划线)属性来标识自己所继承的原型对象。__proto__属性对性能影响非常严重,不建议使用。

ES6学习笔记2—各扩展

2017-04-24
阅读 24 分钟
2.1k
JavaScript 允许采用\uxxxx形式表示一个字符,其中xxxx表示字符的 Unicode 码点。这种表示法只限于码点在\u0000~\uFFFF之间的字符。超出这个范围的字符,必须用两个双字节的形式表示。ES6中只要将码点放入大括号,就能正确解读该字符。

BFC与IFC

2017-04-06
阅读 3 分钟
1.7k
block-level box: display属性为block, list-item, table的元素,会生成block-level box。并且参与block fomatting context。

line box,inline box及vertical-align分析

2017-03-16
阅读 7 分钟
5.6k
一、适用元素 vertical-align适用于inline-level元素,即inline,inline-block或inline-table 。 二、inline与inline-block元素的外边缘和基线 inline元素的外边缘和基线 {代码...} 红线:元素外边缘,即行高的顶部和底部边缘。 绿线:字体的高度。 蓝线:基线。 上图中,左侧的那个,文本的行高设置为与字体大小相同的高...

【译】Vertical-Align: All You Need To Know

2017-03-06
阅读 20 分钟
2.7k
CSS offers some possibilities. Sometimes I solve it with float, sometimes with position: absolute, sometimes even dirty by manually adding margins or paddings.

移动前端中 viewport (视口)

2017-01-16
阅读 3 分钟
3.8k
viewport实际上等于浏览器窗口,拥有浏览器窗口的宽度和高度,<html>元素使用viewport宽度的100%(在未手动设置html元素宽度情况下)。用document.documentElement.clientWidth获取viewport的宽度。用document.documentElement.offsetWidth获取<html>元素本身的尺寸

FCC高级算法题

2017-01-10
阅读 9 分钟
3.3k
下面是一些有效号码的例子(还有下面测试时用到的一些变体写法):555-555-5555(555)555-5555(555) 555-5555555 555 555555555555551 555 555 5555

margin

2016-11-08
阅读 5 分钟
3k
box 的实际大小 = box 的物理大小 + 正的 margin(物理大小指的是除去 margin,也就是包含 border 以内的 box 大小)

让文本垂直居中的几个方法

2016-11-03
阅读 4 分钟
5.5k
一、使用line-height(适用于知道高度,一行文字)让line-height和height一样高,可使文本垂直居中。二、设置上下padding三、通过table

float与absolute脱离文档流的区别

2016-11-02
阅读 1 分钟
8.9k
根据chrome调试和红色边框,可以看到第二个div的背景和边框是占据了第一个DIV的空间的,但是第二个div的文本仍然为第一个DIV留出了位置。