SF
前端周分享
前端周分享
注册登录
关注博客
注册登录
主页
关于
RSS
webpack引入第三方库的方式,以及注意事项
缘自世界
2019-01-14
阅读 4 分钟
7.1k
然后,在使用jquery的模块文件中,通过import $ from 'jquery'或者var $ = require('jquery')来引入。
webpack最小化lodash
缘自世界
2019-01-11
阅读 4 分钟
11k
lodash作为一个比较常用的前端开发工具集,在使用webpack进行vendor分离的实践中,会遇到将整个lodash文件分离到vendor.js的问题。这样会使vendor.js文件变得特别大。
构建多页面应用——优化(二)
缘自世界
2019-01-07
阅读 2 分钟
2.5k
最近,一直尝试使用webpack做多页面应用的开发。并且一个实际的项目为原型,实现对一个静态的企业站进行优化。原站点地址,测试站点地址。 如果想要做一个自己个个人博客,或者企业官网来说,有一定的参考意义。 webpack的resolve.alias 在做模块化开发的过程中,有一个需要解决的问题就是引用模块的路径问题。 注:在we...
构建多页面应用——hash
缘自世界
2019-01-06
阅读 3 分钟
3.2k
这里的hash主要从两个方面来说。一个是webpack生成的hash,另一个是页面链接中的hash,如:http://localhost:8080/ywbk.html#restaurant中的#restaurant。后者在单页面应用的路由处理中经常用到。
构建多页面应用——优化(一)
缘自世界
2019-01-04
阅读 3 分钟
2.2k
而造成webpack.config.js文件增大的原因,主要是从entry,plugins的配置,而造成plugins增加是html-webpack-plugin和webpack-spritesmith的使用。因为每增加一个页面,就需要增加一个entry和实例化的html-wepback-plguin,而每增加一个雪碧图就要使用一个webpack-spritesimth。
构建多页面应用——静态资源的处理
缘自世界
2019-01-01
阅读 6 分钟
5.6k
在之前的系列文章中,我已经介绍了如何用webpack实现多页面应用的js,html,css的处理。今天就主要介绍如何处理静态资源,在web开发中最常见的静态资源就是图片。
mongoose再认识(三)
缘自世界
2018-12-25
阅读 2 分钟
2.1k
今天,说一个常见的知识点插件。对于不熟悉mongoose的人可能会问mongoose中也有插件?这个别说还真的有。 那么,在mongoose中的插件如何使用? mongoose插件的使用 它和通常用的JavaScript的插件一样,都是为了实现代码的重用。 同mongoose再认识(二)中介绍的方法类似。可以在Schema的实例上添加。 首先,介绍一个api ...
mongoose再认识(二)
缘自世界
2018-12-23
阅读 3 分钟
3.6k
在开发中,除了使用mongoose进行一些基本的操作外,就是一些技巧的使用。 文章接续mongoose再认识(一),下文中使用代码可参考这篇文章中的。 虚拟字段 虚拟字段,从字面意思就可以明白,它不是真正的字段,不存在与数据库中,但是当使用model实例查询时,却可以灵活的运用这个字段。 注:这个特性是mongoose自己的,与mo...
mongoose 再认识(一)
缘自世界
2018-12-22
阅读 3 分钟
4k
mongoose 是一个ODM(Object Data Model)的库,也叫做对象数据模型。那么为什么说是对象数据模型呢? 注:MongoDB或者Mongo是NoSQL类型的数据库,也就是说是非关系型的数据库。 它被用来处理数据,实现对象间的转换。 数据处理:创建一个Schema,提供Schema的数据验证功能。 对象的转换:这些对象是指开发过程中创建的对...
构建多页面应用——模板
缘自世界
2018-12-21
阅读 5 分钟
3.8k
因为大多数人都比较喜欢,或者说倾向于用js操作现有的html代码块,而不喜欢用js来生成html代码块,之后再来操作它。很明显的一点儿就是前者清晰明了,后者不是那么直观。
用css3实现ps蒙版效果+动画
缘自世界
2018-12-19
阅读 1 分钟
7.2k
这个动画,其实也并不复杂。它使用background-clip实现了文字蒙版的效果,然后结合了背景图片的animation实现了如上图所示的文字蒙版动画。
构建多页面应用——单个页面的处理
缘自世界
2018-12-18
阅读 4 分钟
3.9k
因为所涵盖的知识点较碎,所以就不按照页面的位置结合组成元素来讲,如:head, body, script等。这里主要介绍head。因为script操作其实就是上一篇文章中已经介绍过的js操作,而body因为内容较多,需要另起一篇文章。
webpack 构建多页面应用——初探
缘自世界
2018-12-16
阅读 5 分钟
15.2k
如何使用webpack构建多页面应用,这是一个我一直在想和解决的问题。网上也给出了很多的例子,很多想法。猛一看,觉得有那么点儿意思,但仔细看也就那样。
webpack4.x的变化(二)
缘自世界
2018-12-15
阅读 3 分钟
3.6k
我之前写过一篇文章webpack4带来了什么,这篇文章优点照猫画虎的意思,文章中说明了一些什么,但好像是还没有说透,感觉不是那么好,所以下定决心,在写一篇,可能这一篇也有不足,但后续还会继续补充。话不多说,下面进入正文。
为什么没有 `<style src="">`
缘自世界
2018-12-11
阅读 2 分钟
6.6k
最近在Twitter上看到这样一个有趣的话题,为什么现在用的是 <link rel="stylesheet" href=""> 引入外部共享的样式文件,而不使用 <style src=""> ?详情请点击[链接]
判断DOM元素是否出现再浏览器窗口中
缘自世界
2018-12-07
阅读 3 分钟
7.5k
懒加载(lazyload):它目的是按需加载,而很大一部分项目的前端实现是通过判断一个元素是否出现在浏览器窗口中,如果出现则将img元素标签内的src属性中的图片地址替换成自定data-src属性的地址,但这里不一定是data-src属性,也可能是srcset,pinterest中就是这样做的,当然你也可以定义成任何你喜欢的,这只是其中的一...
我从HTML的meta中学到了什么
缘自世界
2018-12-05
阅读 3 分钟
3.3k
注意:content属性用来存储meta信息的内容,所有的主流浏览器都支持它,但它一般很少单独使用,我们一般使用http-equiv或name来定义content属性信息(或值)的名称,http-equiv和name在一个meta中通常只能用其中一个。
最大限度的减少浏览器的重新布局(Reflow&Repaint)
缘自世界
2018-12-02
阅读 1 分钟
2.3k
减少浏览器重新布局是优化web性能的一个重要手段。这是因为重新布局是浏览器在请求网络资源后所做的一个必要的工作,这也是浏览器渲染web页面的重要机制(详情可参考浏览器的运行原理)。在浏览器获得新的资源后,它会重新计算文档中个元素的位置和形状,以便刷新web页面(可以是部分内容,也可以是全部),这个过程就是...
用第三方库带来的刚性成本
缘自世界
2018-10-29
阅读 2 分钟
2.6k
我之前一直在思考,在项目中引入第三方库会给我们带来什么,在你为什么用或不用框架?这篇文章中wo说了使用框架(库)带给我们的好处和不使用给我们的好处是什么,但是并未详细说明使用第三方库,它本身又会带来什么问题。
不要忽视代码审查的重要性
缘自世界
2018-10-27
阅读 3 分钟
2.9k
在学校里没有教给你的一项本领就是怎样做一个好的代码审查(CR)。你学习了算法、数据结构、编程语言的基础知识,但没有人会坐下来对你说:“下面是如何确保你能获得很好的反馈的方法。”
你为什么用或不用框架?
缘自世界
2018-10-25
阅读 2 分钟
6.2k
刚开始,我对这个问题也没有太在意,也就是随意的看了看,正如提问者Nicole Sullivan说的那样,我刚开始也觉得这是一个愚蠢的问题。但是这个问题就像蒲公英的种子一样,就这么在我的脑海里扎了根,截至到我这写这篇文章之前,我都有一直关注这个问题,并且在思考这个问题。
webpack4带来了什么
缘自世界
2018-10-17
阅读 4 分钟
4.3k
在开发人员还在体会webpack3.x的余韵时,webpack4.x已经悄然而来。 而对使用者来说,最期待的问题无外乎如下: 新版本与旧版本相比都有哪些改变? webpack3.x到webapck4.x的迁移? 使用webpack4.x我们应该注意什么? webpack的新特性 webpack 作为构建工具的强大之处在于: 可以在 webpack.config.js 中配置很多独特的功...
$.ajax vs axios vs fetch
缘自世界
2018-10-16
阅读 4 分钟
6.3k
答:Ajax是一种可以在浏览器和服务器之间使用异步数据传输(HTTP请求)的技术。使用它可以让页面请求少量的数据,而不用刷新整个页面。而传统的页面(不使用Ajax)要刷新部分内容,必须重载整个网页页面。
浮动的label
缘自世界
2018-10-14
阅读 3 分钟
3.7k
在web项目中,有一个很重的模块就是登陆/注册模块,这个模块的主体部分就是一个form表单,这个form表单包含两个重要input组(用户名/密码),每个input组都包含label和input,而关于 label+input 的布局方案多种多样,不同的设计师有不同的设计风格,不同的前端工程师又有不同的实现方式。通过对比发现,现在的方案是既...
HTML5中dialog元素尝鲜
缘自世界
2018-10-13
阅读 2 分钟
5.9k
对话框(别称模态框,浮层)是web项目中用于用户交互的重要部分,我们最常见的就是js中 alert(),confirm(),但是这个对话框的不美观,也不能自定义样式,所以在开发的过程中,一般根据自己自己的需求造轮子或者使用第三方的。
深入理解vue.js——组件
缘自世界
2018-05-01
阅读 2 分钟
5.4k
熟悉vue或者研究过vue源码的同学都知道,组件是vue最重要的部分之一,而写组件由两种常见的方式: template模板 render渲染函数式的 template式的组件 template式的组件有两种常见的形式: 第一种: {代码...} 第二种: {代码...} 在项目开发中,第一种比较常见。 render渲染函数组件 同样,vue本身也提供了性能更高的re...
JS开发中函数知识点梳理(三)
缘自世界
2018-04-30
阅读 2 分钟
1.3k
这篇文章要介绍的内容是函数表达,因为我个人比较喜欢使用函数表达式定义函数,所以就对它做了一些研究和整理。其实,说到函数表达式,就不得不说到定义函数的另一种方式——函数声明,它们虽然相似,但是又有一些区别,那么它们的区别是什么呢,这个问题会在本文中单独说明,下面进入正文。
JS开发中函数知识点梳理(二)
缘自世界
2018-04-26
阅读 3 分钟
1.6k
函数在JavaScript中被称作第一等公民,这个第一等公民是什么鬼?看看知乎上是怎么回答的。就像我的引路人刚开始跟我说的要想学好一门语言,就要先掌握好一门外语(英语)一样,因为这些计算机编程语言或解释器语言基本都是源于老外开发,所以要想学到原汁原味的东西,查看英文文档是必不可少的。
JS函数知识点梳理
缘自世界
2018-03-07
阅读 3 分钟
2.5k
要想学好JavaScript除了基本的JavaScript知识点外,作为JavaScript的第一等公民——函数,我们要深入的了解。函数的多变来源于参数的灵活多变和返回值的多变。如果参数是一般的数据类型或一般对象,这样的函数就是普通函数;如果函数的参数是函数,这就是我们所要知道的高级函数;如果创建的函数调用另外一部分(变量和参...
eval()不是魔鬼,只是被误解了(翻译)
缘自世界
2018-02-04
阅读 3 分钟
6.7k
在JavaScript中,我不确定是否有比eval()受到更多诽谤的。它就是个简单的函数被设计用来将字符串转换为可被执行的JavaScript代码。在我的早期的职业生涯里,它比任何其他的东西更受关注和误解。
1
(current)
2
3
下一页
1
(current)
下一页