03 2020 档案
摘要：[TOC] 什么是npm？ npm是随同NodeJS一起安装的包管理工具，能解决NodeJS代码部署上的很多问题 npm基本操作理解？ 1. 有一个放了所有需要被共享的代码的代码仓库， 2. 发邮件通知jquery，bootstrap，underscore作者使用npm publish把代码提交到代
阅读全文
摘要：什么是X UA Compatible？ X UA Compatible是IE8的一个专有属性，他告诉IE8采用何种IE版本去渲染网页，在html中的head标签中使用 为什么要用X UA Compatible？ 在IE8刚推出的时候，很多网页由于重构的问题，无法适应较高级的浏览器，所以使用X UA
阅读全文
摘要：ajax ajax即 不是一门云烟，而是对现有技术的综合利用。本质是在HTTP协议的基础上以异步的 方式与服务器进行同行 异步:值某段程序执行时不会阻塞其他程序执行，其表现形式为程序的执行顺序不依赖程序本身的书写顺序 XMLHttpRequest对象 浏览器内建对象，用于在后台与服务器通信(交换数据
阅读全文
摘要：定义 async function 用来定义一个返回AsyncFunction对象的异步函数。异步函数是 指通过实践循环异步执行的函数，他会通过一个隐式的Promise返回其结果 语法 async function name([param[,param[,....param]]]){statemen
阅读全文
摘要：什么是promise？ Promise是异步编程的一种解决方案，比传统的解决方案——回调函数和事件更合理更强大。Promise，简单说就是一个容器，里面保存着某个未来才会结束的时间(通常是一个异步操作)的结果。 从语法上说，Promise是一个对象，从它可以获取异步操作的消息。promise提供统一
阅读全文
摘要：选取工具组认识 快捷键：M/shift+M 在PS中可以通过创建选取对图像进行填充、移动。复制、变换等编辑操作。在PS操作中，有那个选取选取范围是比较常用的方法。建立选取以后，就可以对选区内的图像进行操作 选区属性 选区布尔运算 新选区 添加到选区(shift) 从选区中减去(alt) 与选区相交(
阅读全文
摘要：移动工具 移动工具不进可以秦松的选择每一个图层，还可以移动哥哥图层到自己的理想位置，还可以进行文件图像与其他文件之间的移动 移动工具快捷键 v 移动工具属性 自动选择 在默认情况下，移动工具的"自动选择"没有勾选。表示只能选中图层窗口中选定的固定图层，不能随意点击选择别的图层，当选中"自动选择"，可
阅读全文
摘要：ps界面认识 不小心关闭了ps中的某个界面，可以在菜单栏—— 窗口中设置 ps文件的新建与配置 新建文件 从菜单栏中选中 文件—— 新建 快捷键 Ctrl + N 新建对话框 名称 新建文件时名称可根据实际情况自定义 预设 若有经常使用的尺寸，可以直接设置好宽度和高度，点击存储预设 注：ctrl+a
阅读全文
摘要：Class的继承 简介 class可以通过extends关键字实现继承，这比ES5的通过修改原型链实现继承，要清晰和方便很多。 上面定义了一个 类，该类通过extends关键字，继承了Point类的所有属性和方法，但是由于没有部署任何 代码，所以这两个类完全一样，等于复制了一个 类。下面，我们在 内
阅读全文
摘要：class基本语法 es5创建对象的方式 原型属性(prototype属性)原型属性也叫prototype属性，每一个函数都有prototype属性，初始指向一个空对象(也叫原型对象)。我们可以给prototype进行修改，让它引用一个费控对象，只有在该函数是构造函数时 才有实际意义。对于费构造函数
阅读全文
摘要：vue cli3搭建pwa项目（一） 快速创建项目 vue create vue pwa 注：项目名称不能驼峰命名 选择预设 (第一个选项是之前设置保存的，如果是开始创建，只有以下两个选择) 默认（babel,eslint） 手动选择功能 这里回车选择手动选择功能 选择项目需要的功能(按空格键选择，
阅读全文
摘要：前言 在vue项目中，组件是vue最强大的功能，对于vue组件，我们知道vue组件的作用域是独立的，每个实例化的组件都只能访问组件内部定义的data，但是在一些情况下，我们需要访问其他组件的数据，就有了组件通信的问题，在vue里组件之间的关系有以下几种：父子，隔代，兄弟。针对不同的关系，实现组件之间
阅读全文
摘要：什么是组件？ 组件允许你讲UI拆分为独立可复用的代码片段，并对每个片段进行独立的构思 组件，从概念上类似于JavaScript函数。它接受任意的入参(props)，并返回用于描述页面展示内容的React元素 函数组件与class组件 定义组件最简单的方式就是编写JavaScript函数 该函数是一个
阅读全文
摘要：Rect之元素渲染 如上述代码中所示，我们通过JSX语法创建的就是React元素，通过babel编译，将会变成一个JavaScript对象，(通过浏览器，我们可以查看到),React元素是构成React应用的最小块，描述了你在屏幕上想看到的内容 将一个React元素渲染为DOM 我们需要渲染Reac
阅读全文
摘要：什么是JSX 上面代码，像是JavaScript，也像是html，这就是jsx，一种JavaScript的语法扩展，在React中使用JSX来描述用户界面。JSX是在JavaScript内部实现的 为什么使用JSX 如果要在js里写HTML，就是创造一个一个的DOM对象，用js来写，会非常的冗余，并
阅读全文
摘要：什么是JSX 上面代码，像是JavaScript，也像是html，这就是jsx，一种JavaScript的语法扩展，在React中使用JSX来描述用户界面。JSX是在JavaScript内部实现的 为什么使用JSX 如果要在js里写HTML，就是创造一个一个的DOM对象，用js来写，会非常的冗余，并
阅读全文
摘要：怎么使用react 在网页中引入react npm下载后在项目中引入react 在网页中引入react addReact.html 上面代码中需要连个地方注意，第一，在最后一个` 安装create react app并创建my app npm install g create react app c
阅读全文
摘要：什么是react？ react是一个用于构建用户界面的JavaScript库 为什么说react被用来作为MVC中的V层？ react特点？ 声明式 React是创建交互式UI变得亲而一举。为你应用的每一个状态设计简洁的视图，当数据改变时React能够有效地更新并正确地渲染组件。以声明式编写UI，可
阅读全文
摘要：webpack之创建library 假设我们用webpack打包一个我们编写的JavaScript库，并在项目中引用 demo 项目目录 index.js ref.json webpack.library1.js 在package.json中加入字段 执行npm run webpackLibaray
阅读全文
摘要：webpack 之code splitting code splitting方法 入口起点：使用entry配置手动地方分离代码 防止重复：使用CommonsChunkPlugin去重和分离chunk、 动态导入：通过模块的内联函数调用来分离代码 一、入口起点 示例 项目目录 a.js b.js we
阅读全文
摘要：为什么需要进行代码拆分? 随着前端代码需要处理的业务越来越繁重，我们不得不面临的问题是前端的代码体积也变得越来越庞大。这造成无论是在调试还是在上线时候都需要 花长时间等待编译完成，并且用户也不得不花额外的时间和带宽下载更大体积的脚本文件。对于性能优化来说，需要减少http请求，用webpack 进行
阅读全文
摘要：webpack 生产环境构建 背景 在项目开发的时候，我们通常会将程序分为开发环境和生产环境，开发环境通常指的是我们正在开发的这个阶段所需要的一些环境配置，也就是方便我们开发人员调试开发的一种环境；生产环境通常 是指我们将程序开发完成后经过测试之后无明显异常准备发布上线的环境，也就是用户可以正常使用
阅读全文
摘要：什么是tree shaking？ 前端中的tree shaking可以理解为通过工具"摇"我们的js文件，将其中用不到的代码"摇"掉，是一个性能优化的范畴。具体来说，在webpack项目中， 有一个入口文件，相当于一棵树的主干，入口文件有很多依赖的模块，相当于树枝。实际情况中，虽然依赖啦某个模块，但
阅读全文
摘要：HMR 什么是HMR? Hot Module Replacement(HMR),当你对代码进行修改并保存后，webpack将对代码重新打包，并将模块发送到浏览器端，浏览器通过新的模块替代老的模块， 这样在不刷新浏览器的前提下就能够对应用进行更新。HMR 模块热替换功能会在应用程序运行过程中替换、添加
阅读全文
摘要：webpack dev middleware 什么是webpack dev middleware webpack dev middleware是一个容器(wrapper)，它可以把webpack处理后的文件传递给一个服务器(server)。webpack dev middleware就是expres
阅读全文
摘要：在webpack的构建过程中我们需要用到一些基本构建开发工具来提升我们的工作效益 webpack常用开发工具模块 source map 自动追踪代码错误所在的文件 webpack watch 观察者模式自动编译 webpack dev server 指定目录启动本地服务 webpack dev mi
阅读全文
摘要：webpack dev server 什么是webpack dev server？ webpack dev server是webpack官方提供的一个小型Express服务器。 通过配置它可以在开发模式下为webpack打包生成的静态资源文件启动一个web服务器，并检测代码的进行实时更新 webpa
阅读全文
摘要：webpack管理输出 output output配置如何输出最终想要的代码，output是一个object里面包含一系列配置 filename output.filename配置输出文件的名称，为string类型，如果只有一个输出文件，我们可以将它写成静态不变的 filename:"bundle.
阅读全文
摘要：webpack管理资源 webpack并不能处理js以外的静态资源，可以痛过loader来解决这一问题 loader loader用于对模块的源代码进行转换。loader可以使你在import或加载模块时候，预处理文件。因此loader类似于其他构件工具中"任务"，病提供了处理前端构件步骤的强大方法
阅读全文
摘要：在webpack中使用配置文件 如果不想在终端中输入命令行，就可以创建一个可以取代CLI的配置文件 接上一篇文章 "webpack起步" 1. 在todo目录下新建文件并命名webpack.config.js 2. 在webpack.config.js里编写以下内容 3.在终端执行npx webpa
阅读全文
摘要：webpack起步 准备 1. 安装nodejs 2. 新建文件夹并并命名为todo; 3. 进入到todo文件目录下 4. npm init y(npm初始化，在init的时候省去了敲回车的步骤，生成默认的packge.json) 5. 安装webpack，webpack cli(npm i sa
阅读全文
