- 博客(26)
- 资源 (1)
- 收藏
- 关注
RSS订阅原创 在vue-cli3中使用three.js的OBJLoader和MTLLoader来加载三维模型文件.obj和.mtl
第一种方法使用three-obj-mtl-loader插件使用npm installthree-obj-mtl-loader --save 在组件中引入：import { OBJLoader, MTLLoader } from 'three-obj-mtl-loader' 使用OBJLoader和MTLLoader加载文件： // 加载obj和mtl模型 let _this ...
2019-04-03 12:22:08
13817
6
原创 webpack的编译优化
1、减小代码体积，可以使用CDN引入一些npm包。局部引入一些类库，避免无用的文件的引入。2、在使用loader的时候，使用exclude和include，减少loader遍历的目录范围，加快webpack的构建速度。3、在resolve中配置alias，减少检索路径。4、使用dllPlugin或者allReferencePlugin 进行预先构建，把改变频率比较小的第三方库等依赖单独...
2018-11-18 21:18:46
590
原创 redux和react-redux学习
redux三个基础的API：Action：redux中的state需要通过action去更新，store.dispatch(action)去分发actions，每个action需要有一个命名和returnReducer：actions只是描述有state更新，需要reducer去描述应该如何更新state，可以处理多个action。redux还提供combineReducers({})处理多个re...
2018-06-24 09:48:50
483
原创 富文本编辑器Ace的使用
官方文档网址：点击打开链接官方文档是全英的，对于英文较差的同学建议在chrome浏览器中添加有道或者其他翻译插件Ace可以编写代码或者文本，实现的功能有代码高亮、缩进、折叠、自动补全等。不过在真实业务中大多数是使用它的高亮和自动补全功能。例如在一个输入框中为了实现匹配到指定字符串，让它高亮显示，可以提醒输入者谨慎输入，达到较好的用户体验。还有就是自动补全，也是非常有用的，可以自定义补全功能。Ace...
2018-03-23 13:29:35
7102
7
原创 前端页面性能优化--笔记
1、使用fis3来构建和压缩2、使用TinyPNG来压缩PNG和JPG图片3、使用智图来生成webp图片4、使用spritecow来制作雪碧图和自动生成雪碧图代码5、网页的解析过程：首先是解析HTML，生成DOM树，再从上到下解析DOM树，解析到需要引用外部文件的时候去引用为外部文件在进行解析，最后重新组成render树，绘制在页面上6、css会阻塞js的执行，不会阻塞js
2018-01-29 21:29:28
230
原创 面试经验分享
1、undefined == null // trueundefined === null // false解析：typeof(undefined) // undefined typeof(null) // Object 双等号不用要求数据类型相同2、js中的函数调用方法解析：（1）函数调用模式：function add(a) { console.log(a);}add(123);（
2018-01-17 22:14:28
185
原创 Vue项目中svg图的使用
svg图是可缩放矢量图，在页面中使用可以很好的提高用户体验1、使用传统的svg图：首先新建一个svg.vue文件，在该文件中使用svg标签定义一堆svg图，再分别用symbol标签分别定义一个个svg图，再使用id来标记各个svg图，最后在需要实用的地方使用use标签绑定每个id即可使用svg图具体的制作svg图可以参考svg图相关文档2、在这里主要介绍使用插件使用svg
2018-01-03 16:43:02
18336
2
原创 Javascript中的原型链和继承一看就会
javaScript对每个创建的对象（或者实例对象）都会创建一个原型对象（没有 prototype属性）。例如var arr（实例对象） = new Array() （构造函数） // 通过构造函数创建对象arr.__proto__ == Array.prototype（原型对象） // true使用new创建的对象还从原型上获得了一个constructor属性，指向构造函数本身a
2017-12-30 21:37:10
207
原创 使用ngrok反向代理调试Vue项目
1、下载ngrok：点击下载2、解压下载文件，打开.exe文件，使用ngrok http 80命令设置反向代理80端口（端口可以根据需要设置）3、在浏览器中输入 http://127.0.0.1:4040可以开启ngrok用户界面4、使用npm run dev开启Vue服务器，注意要设置Vue中服务器的端口问80（新版本的Vue-cli搭建的工程需要在webpack.dev.conf.
2017-12-26 21:54:48
1666
1
原创 项目笔记--Hybrid和express
1、Hybrid开发是一种新的开发模式，可以快速更新迭代产品，并且可以快速占领市场，给公司带来很高的价值。Hybrid实现的原理是使用Webview的window对象或者Webview的URL观察者使用Webview的URL时就是在页面中定义一个iframe，并赋给src属性，再把这个iframe绑定到body上。需要设定方法来实现，特别是URL的转码和定义格式，需要和APP开
2017-12-05 21:05:21
201
原创 Javascript中的执行环境和作用域细讲
对每一个初学js的小伙伴来说，执行环境和作用域都是比较难理解的，而要真正理解这些复杂的概念，就必须不断去看，不断去实践，从中发现和总结其中的规律。首先，我先讲一下执行环境。要理解执行环境，需要理解js引擎中关于变量的声明和提升。在js引擎中，变量分为全局变量、局部变量和私有变量。其中全局变量就是在全局中定义的变量，即是在一开始和函数外定义的。局部变量是在函数内部定义的变量。私有变量从一定程
2017-11-10 21:11:34
175
原创 阿里云服务器的域名解析解决方案
1、先是在阿里云的万网上购买属于自己的域名。2、再在阿里云的控制台里的找到云解析DNS，进行解析。3、解析域名需要一段时间，可以通过本地主机的CMD，输入ping 你的域名，查看是否解析成功。（注意：这里有一个坑，你需要在阿里云的控制台的安全组规则里面添加一条安全组规则，协议类型是ICMP，才能通过ping查看是否解析成功）4、解析域名成功后，还需要添加一个安全组规则，即是开启80
2017-10-29 21:18:39
3216
原创 JS的设计模式
工厂模式：在一个函数中创建一个对象，并赋予这个对象属性和方法例如：function factory(name, job) { var o = new Object(); o.name = name; o.job = job; o.sayName = function () { console.log(this.name); };
2017-10-13 23:52:01
218
原创 js中this详解
前言：对于没有使用严格模式的情况，this对象才会起作用。this对象是在运行时，被函数的执行环境绑定的。情况1：在全局函数中，this等于window，只有当函数作为某个对象的方法调用时，this才会等于那个对象。还不知道什么是全局函数的请参考这里点击打开链接情况2：匿名函数的执行环境具有全局性，this通常指向window例如var name = "window";var ob
2017-10-10 22:26:56
214
原创 常用js字符串操作方法
1、charAt()：返回在指定位置的字符，例如var str = "abcdefg";console.log(str.charAt(4)); //输出e2、charCodeAt()：返回在指定位置的字符的Unicode编码，例如var str = "abcdefg";console.log(str.charCodeAt(2)); //输出993、concat()：在尾部连接其他
2017-09-17 00:23:57
277
原创 2017/9/16随笔--ES6新特性
1.在script标签中添加defer和async属性实现异步加载外部脚本：defer与async的区别是：前者要等到整个页面正常渲染结束，才会执行；后者一旦下载完，渲染引擎就会中断渲染，执行这个脚本以后，再继续渲染。一句话，defer是“渲染完再执行”，async是“下载完就执行”。另外，如果有多个defer脚本，会按照它们在页面出现的顺序加载，而多个async脚本是不能保证加载顺序的相
2017-09-16 14:07:17
195
原创 2017/9/16随笔--Jquery源码解读
1.jquery整体架构：（1）有更完整的选择器（2）使用入口函数$(function() {})（3）支持回调函数（4）异步编程（5）浏览器检测（6）事件操作（7）动画（8）Ajax和数据存储$.data2.利用函数作用域，使用闭包的形式来封装整个jquery代码，避免局部变量污染全局3.不用new来实例化一个jquery对象，变得更加简便：$
2017-09-16 00:17:46
225
原创 使用Vue-cli创建项目
1、Vue.js有一款官方的脚手架生成工具vue-cli，通过npm install -g vue-cli进行全局安装。（提示：脚手架是通过命令来生成一个项目模板，包括完整的项目目录结构和相关模块的下载）2、项目的热部署：热部署就是系统在运行过程中，可以对功能进行可配置，而不用停止或关闭系统。对前端开发而言，就是每次修改 项目目录中src 中的文件后，不需要再按浏览器的刷新来更新代码，启动的
2017-09-11 19:50:47
587
原创 使用create-react-app创建项目
在创建react项目之前，需要经过安装和配置webpack和babel等工具，操作很麻烦。通过使用create-react-app创建项目，可以免去安装和配置webpack和babel等工具，使得创建项目变得便捷许多，因为他们已经被预先安装和配置了。是不是很迫不及待想体验一下了呢？下面，我们一起进入操作吧。其实是很简单的哦在使用之前，我就先默认你们安装了Nodejs和配置好了npm
2017-08-30 15:05:40
2738
原创 2017/9/7随笔
1、javascript中的XMLHttpRequest负责客户端发起请求，Web API负责在服务器端返回响应2、序列化：将对象转换成文本的过程，使用javascript中的JSON.stringify()方法； 反序列化：将文本转换成对象的过程，使用javascript中的JSON.parse()方法
2017-08-29 20:38:45
205
原创 使用webpack打包.css文件时需要注意的事项
由于原本的webpack没有打包.css文件的模块文件，因此需要通过npm来安装css-loader。在当前项目目录下使用命令行工具，输入：npm install css-loader --save-dev安装成功后，再在要打包的文件里（例如在js文件里）添加代码：require('css-loader!./xxx.css')最后重新在命令行中使用webpack来打包，即可使用
2017-08-24 23:59:18
1183
原创 CSS中position的使用
position：属性值；值 描述absolute 生成绝对定位的元素，相对于 static 定位以外的第一个父元素进行定位。元素的位置通过 "left", "top", "right" 以及 "bottom" 属性进行规定。fixed 生成绝对定位的元素，相对于浏览器窗口进行定位。元素的位置通过 "left", "top", "right" 以及
2017-08-17 16:17:14
230
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人