- 博客(27)
- 收藏
- 关注
RSS订阅原创 通过浏览器端less实现定制主题功能
实现效果参考以下页面：https://antdtheme.com/定制主题的主要实现思路是通过动态修改scss变量实现样式变化，延伸出来主要需要解决以下问题如何在浏览器页面修改less变量，并能实时查看效果 如何把less变量提取出来，修改并覆盖回源码中实现过程：引入浏览器端less以实现页面动态修改less变量 https://cdn.bootcss.com/less.js/3.9.0/less.min.js 引入less样式文件，这里需要注意的是引入的是less源文件，没有经过编译的
2020-07-02 11:57:43
579
原创 模块化发展历程
模块化是多个js文件的相互依赖关系和全局变量污染问题的一种解决方案1. IIFE利用闭包实现模块化，把代码包装到单独的函数作用域中执行。核心思想是建一个管理中心，提供注册模块和获取模块的方法，注册的模块需要记录起来，通过依赖注入的方式注入到依赖的模块中。整个实现过程很简单，在《你不知道的javascript（上）》中有详细实现过程。IIFE只是一种解决思想，它是不够完善的，如没有异步加载js...
2019-12-09 18:11:13
338
原创 前端自动化生成---思考笔记（持续更新）
背景：一些系统类项目，前端的页面来来去去是那几个类型，列表、表单居多。这些页面都是类似的，是否能尽量节省重复劳动？目标：通过简单的一些配置能够自动生成列表、表单等思考思路：想自动先手动，是不是应该实现通过手写配置就能生成页面。第一个想到vue的render函数，写一份配置自动调用createElement？ 用CreateElement写完一个页面我们就可以得到一份非常复杂的配置，这...
2019-11-05 18:22:06
556
1
原创 你不知道的JavaScript(上)--知识点汇总
前言：写这个博客是为了检验自己的阅读成果，同时把自己的一些理解分享给同样喜欢这书的人，我会持续把自己的一些新的理解更新进来，不足的地方希望大家不吝指教！作用域是什么 编译原理：常规语言编译有下面三个步骤，区别在于JS是运行时编译，并且比下面步骤复杂得多 分词/词法分析、分词顾名思义就是把一整句代码拆成一个个词法单元，var a = 2; 进行分解，会得到以下结果：var、a、=、2、；...
2019-11-04 19:03:40
204
原创 JS异步
先说说异步是什么，众所周知js是单线程的，从而导致一些类似等待的操作会使js停止工作，异步就是为解决此类问题而生。异步的过程是把需要等待执行的动作，比如延时，ajax等放入异步队列，在主线程任务完成后，通过event-loop检查异步队列中是否有待执行任务，有则放入主线程中执行。这种做法的目的是为了保证dom操作的唯一性，避免多处同时操作dom。但是异步本身是存在一些问题，主要问题是异步的...
2019-02-18 14:21:13
232
原创 手把手搭个vue的脚手架 - 2. 模板搭建
开发思路：脚手架我们已经搭好了，模板里该做的就是各种webpack的配置为主 先考虑怎么运行一个vue的项目 首先我们需要解析.vue文件，使用vue-loader 其次我们需要一个开发服务器来运行项目 webpack-dev-server 最后我们需要生成一个模板来运行vue项目 html-webpack-plugin 最小功能级已经完成了，考虑一下优化 代码规范 eslint，...
2018-11-27 20:20:52
171
原创 手把手搭个vue的脚手架 - 1. 脚手架搭建
开发思路：生成自己的命令，如：vue create hello-word 执行create命令 create命令生成模板，生成模板的方式我们可以通过git clone一个项目下来 如何自动执行git clone呢 克隆完成，然后呢？开发历程：所谓生成自己的命令，其实就是写了一些js脚本，通过node去执行 一般情况我们通过node运行js脚本是这样的：node app.js。现...
2018-11-27 15:46:01
212
原创 使用 express 搭建node服务
express有几大特点，一是帮我们处理了路由，二是中间件，三是对require以及respones进行了很多方便使用的拓展，四是封装了对模版引擎的调用方法。下面的实例是对上述四点的简单使用const path = require('path')// 引入 expressconst express = require('express')// nunjucks是一个独立...
2018-11-15 18:44:51
186
原创 vuex
一. 五大核心概念：1. state：数据， 一般通过组件的 computed 获取2. getter：可以理解成获取数据的接口，在这里获取可以对数据做一些派生处理3. mutation：修改数据的入口，ps: 不能进行异步操作，否则会导致调试的状态记录不准确4. action：行为，可以在这里对修改数据前做一些操作，比如异步请求。完成后调用 mutation5. module...
2018-11-12 19:08:02
96
原创 ES6学习笔记
一. var与let，const的区别 1. let声明的变量只在它所在的代码块有效，并且let不存在声明前置 2. 当var全局与let局部同时声明一个变量时，存在暂时性死局。在let声明之前无法调用该变量 3. const声明的常量也只在当前代码块有效 4. let 与 const 声明的变量常量不再作为顶层对象（window）的属性...
2018-11-12 18:41:41
100
原创 angular-rxjs
一. rxjs 发布订阅模式使用 1. 发布订阅模式简单来说就是发布了一个主题后，其所有的订阅者都会收到这个主题下的消息。可以理解成QQ群，创建QQ群就是发布主题，加入QQ群就是订阅。订阅之后你就会收到这个QQ群的消息 2. 发布主题import { Observable, Subject } from 'rxjs';@Injectable({ providedI...
2018-08-22 15:26:25
340
原创 vue 笔记一基础知识
一. 一些实用的方法及属性1. $root 根组件2. $children3. $slots, $scopedSlots 插槽4. $refs 快速获取节点 <div ref='name'>5. $isServer 服务端渲染时做判断6. $watch(name, fn) 监听变化，配置外引用需要自己注销，获取到watch实例再直接调用销毁。var a = a...
2018-08-17 18:25:18
128
原创 vue-loader 配置及 eslint 使用
一. vue-loader 配置详解1. preserveWhitepace: true // 清除文本换行等情况空格2. extractCSS: true // 把vue的css提取到单独的文件，默认3. cssModules: {localIndetName: '[xxx]', camcelcase: true} // 用法：<style module>...
2018-08-17 13:42:50
3390
原创 webpack 打包 --- js and es6
一. 打包JSwebpack最简单的用法，声明一个入口以及出口即可，entry为入口，output为出口 const path = require('path');const config = { entry: './index.js', output: { path: path.resolve(__dirname, 'dist'), f...
2018-08-12 12:27:35
433
原创 webpack三种使用方式
一. webpack命令 打包： webpack <entry> <output>二. webpack配置 打包：webpack // 默认使用webpack.config.js 配置文件三. 第三方脚手架 angular-cli 等...
2018-08-10 17:39:20
238
原创 webpack核心概念
一、Entry 入口 入口是指代码的入口或者打包的入口，可以是一个或多个，当一个程序需要分开打包的时候可以设置多个入口二、Output 出口 打包后的文件，对应入口也是一个或多个。可以自定义名称规则也可以配合CDN三、Loaders 处理JS之外的资源文件 主要工作是把JS之外的文件转换成JS可以认识的模块四、Plugins 插件辅...
2018-08-10 17:30:06
109
原创 Angular VS React Native 组件篇
废话不多说，本篇主要是介绍Angular中各种组件的用法，顺便跟比较RN中的组件做比较1.组件生成方式 在RN中，组件的生成是通过注解，RN中则是通过继承组件类。2.组件交互方式 2.1 父子组件数据交互方式 NG中组件之间进行数据交互，主要通过组件中暴露的两个接口，Input和Output。 RN中，组件交互主要通过属性props。在RN中组件分成属性跟状态两个属性，属...
2018-05-27 18:17:20
938
原创 React Native 性能优化
以下观点是对腾讯技术分享大会的提到的优化方式进行总结并加以个人理解一. JS方面优化，目的是为了让加载更快，滚动更流畅，响应更灵敏 1.加载速度方面，主要解决数据加载的问题。第一个方式是进行数据缓存。第二个是减少数据的请求，这个可以通过数据复用来解决，比如组件之间通过数据交互减少对数据的请求。第三个是异步加载 2.滚动方面主要是列表的滚动优化，第一种方式是在通过组件钩子函数在页面渲染前...
2018-05-26 15:25:30
730
原创 React-Native 组件生命周期
RN中组件生命周期主要由三个部分组成：挂载，更新，移除1.挂载 getInitialState() : 组件挂载前调用，一般用于设置组件初始状态 componentWillMount() : 挂载前立即调用 componentDidMount() : 挂载后立即执行2.更新 componentWillReceiveProps() : 组件属性改变时调用 shouldC...
2018-05-26 12:13:58
142
原创 React Native 沉浸式标题栏与安卓全面屏适配
一：RN标题栏的适配很简单，官方提供了一个原生组件，可以设置标题栏背景之类的<StatusBar backgroundColor={'#e34451'}/>二：全面屏适配， 参考文档：https://android-developers.googleblog.com/2017/03/update-your-app-to-take-advantage-of.html 全面屏...
2018-05-26 10:15:01
7100
原创 React Navigation (v2)导航器
在RN里，一个页面可以由一个或多个组件构成，当进行页面跳转时就需要用到导航。首先必须缕清导航跟组件的关系，导航是用于控制组件的渲染，导航跟导航之间可以相互嵌套。导航控制组件渲染很好理解，就是导航根据路径决定渲染哪个组件（例1）。导航跟跟导航相互嵌套，这里我举个APP常用的路由构建例子（例2）以下例子并非基础用法，只是个人理解，详情参考官方文档：https://v2.reactnavigat...
2018-05-23 14:36:05
1566
1
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人