特牛生活网

20200607 前端开发日报

每日开发周报
  • 使用 Nodejs 开发的 SpaceX-API 开源了

    上面是这个图片不是从网上随便找的,来自于 SpaceX-API 项目的 Github 网站,想起了之前说的一个玩笑 “面试造火箭” 这次是真的造火箭了。。。 SpaceX-API 是什么? SpaceX-API 是一个用于火箭、核心舱、太空舱、发射台和发射数据的开源 REST API。 https://docs.spacexdata.com 展示了所提供的 API 接口,还包括

  • 四年前端带你理解路由懒加载的原理

    前言 说起路由懒加载,大家很快就知道怎么实现它,但是问到路由懒加载的原理,怕有一部分小伙伴是一头雾水了吧。下面带大家一起去理解路由懒加载的原理。 路由懒加载也可以叫做路由组件懒加载,最常用的是通过 import() 来实现它。 function load(component) { return () => import(`views/${component}`

  • 从零开始解说vue中动态组件的创建和使用

    逻辑: 用户手动选择加入那些组件 方式:通过element ui tree组件复选框来选择,加载哪个组件 1.在html页面构建 加入keep-alive是保持这些组件的状态,以避免反复重渲染导致的性能问题 el-tree(:data="treeData" ref="tree" class="filter-tree" show-che

  • 一分钟玩转 Git

    今天又有新来的小朋友问我关于 Git 的用法,我发现还是有蛮多新人不会用的,或者用不好的。其实想想自己刚工作时也是倒腾不清楚这些参数和用法,而且总怕出错,慢慢的多看文档、用得多了就熟悉了,今天简单跟大家

  • 来自 1000+ 个项目的 10 大 JavaScript 错误(以及如何避免)

    为了回馈我们的开发人员社区,我们查看了包含数千个项目的数据库,并发现了JavaScript中的前10大错误。我将向你展示导致它们的原因以及如何防止它们发生。如果你避免这些“陷阱”,它将使你成为更好的开发人员。 由于数据为王,因此我们收集、分析并排名了前10个JavaScript错误。Rollbar收集每个项目的所有错误,

  • html篇–这可能是目前较为全面的html面试知识点了吧

    也不知道有没有跟小编有同感的童鞋,随着技术的逐(ri)渐(yi)提(tui)升(bu),对于一些底层的概念性的知识点却有些遗忘。有时候知道是这么个意思,但是表述出来的时候也没能完整的说到点子上。出现此现象的时候,小编觉得是时候该做点什么了(嗯!)。 以下是小编就这HTML常见的问题整理出来的知识点,后继还会出 CSS

  • Vuex的各个模块封装的实现

    一、各个模块的作用: state 用来数据共享数据存储 mutation 用来注册改变数据状态(同步) getters 用来对共享数据进行过滤并计数操作 action 解决异步改变共享数据(异步) 二、 创建文件: actions.js getters.js index.js mutations.js mutation-types.js s

  • Vuex架构指南 —— 你真的会用Vuex吗?

    最近,在和朋友们协作的时候,暴露了许多问题,这其中最让人头疼的应该是, 代码组织问题 。 代码组织能力会随着知识面的拓展逐渐养成,但是在这个过程中,你是否看过优秀的、让人眼前一亮的代码,并从中获得感悟,很大程度上影响着最终代码组织能力的强弱。这并不单单看你的阅历,和做过项目的多少,而是有意识地,

  • 前端持久化之浏览器存储技术(localStorage、sessionStorage 、session、cookies)

    表格一览 特性 cookie localStorage sessionStorage indexDB 数据生命周期 一般由服务器生成,可以设置过期时间;前端采用和js-cookie等组件也可以生成 除非被清理,否则一直存在;浏览器关闭还会保存在本地,但是不支持跨浏览器 页面关闭就清理刷新依然

  • 前端开发必备工具箱

    前端开发是一个相当复杂的方向,至少就大项目而言,你很难仅用浏览器和编辑器完成工作。这里列出了我在开发过程中用到的工具。我希望这个列表能帮助其他人发现一些可以用在工作流程中的好工具

  • vue路由hash模式引发的血案

    路径1: xxxxx.djtest.cn/driver-regi… 路径2: xxxxx.djtest.cn/driver-regi… 大家平常用那个什么格式的链接,路径1还是路径2???? 我一直习惯用路径2,可是就在前不久出现了一个线上bug:sob::sob::sob:。 这个bug原因还是路径不规范造成的,当是我一脸懵逼,我是谁,我在哪???? url的组成 协议

  • JavaScript必须掌握的基础 —> 原型&原型链

    原型和原型链的主要作用: 实现属性和方法的公用 继承 所以下面的例子全是以构造函数为例。 原型 函数是也是对象,是一个属性的集合,所以函数下也有属性,也可以自定义属性。当我们创建一个函数时就默认会有一个

  • 循序渐进VUE+Element 前端应用开发(7)— 介绍一些常规的JS处理函数

    在我们使用VUE+Element 处理界面的时候,往往碰到需要利用JS集合处理的各种方法,如Filter、Map、reduce等方法,也可以设计到一些对象属性赋值等常规的处理或者递归的处理方法,以前对于这些不是很在意,但往往真正使用的时候,需要了解清楚,否则很容易脑袋出现短路的情况。本篇随笔列出一些在VUE+Element 前端开发中经

  • 那些不常见,但却非常实用的css属性(整理不易)

    1、-webkit-line-clamp 可以把 块容器 中的内容限制为指定的行数。并且在超过行数后,在最后一行显示"..." 这是正常的展示 {代码...} 这是加了 line-clamp 后的展示 [链接] 2、all 将除却 unicode-bidi 与 direct

  • 如何通过nvm安装多版本nodejs?如果nodejs安装成功,npm安装失败了怎么办?

    我们在开发项目的时候,最开始,是只有一个老的项目,老项目单独安装了node版本4.4.7,后来有了新项目,由于有两个项目,但是一个需要老一些版本的node,一个需要新版本的node,因此需要在两个版本之间进行切换,这时候应该怎么做呢? nvm可以很好的解决这个问题,我们一起来看看把。 一、什么是nvm? nvm就是nod

  • 基于Bpmn-js的流程设计器校验实现

    它根据一组已定义的规则来验证您的图表,并将其报告为错误或警告。它可以从命令行检查您的BPMN图,或者通过 bpmn-js-bpmnlint 将其集成到我们的 BPMN建模器中 : 核心规则 库的核心是用于检测BPMN图中某些模式的规则。每个规则都是由一段代码定义的,该代码可以检测并报告从丢失标签到检测到特定的易于出

  • webpack 如何同时输出压缩和未压缩的文件

    有的时候我们想要同时生成压缩和未压缩的文件,比如我们构建 lib 包的时候,我们希望用户能够使用压缩过后的代码文件作为 cdn 文件,最简单的一个方式就是通过指定环境变量,比如指定 MINIFY,如下: const path = require('path') const isMinify = process.env.MINIFY /** * @type {import('webpack').Configurat

  • 记 vue-cli 项目首页加载速度慢的有效优化

    开始我想把这个锅甩给网速,但我发现一些大商城项目(淘宝,京东),在网速一般的情况下,加载速度依然还是挺快,哎,网速不背这个锅 还是找项目的原因吧,加载时间4.5s 监控首页加载的过程,找到拖后腿的 vendors***.js 这个锅他来背 1.9M 的 js文件下载3.42秒 ,先不说网速,这个js也太TM大了

  • Flutter Weekly Issue 58

    教程 逆向 Flutter 应用 进展汇总 | Flutter 精彩不停,与您同在 插件 creditcard-slider Dart package for creating a credit card slider flutter-orientation

  • 写一个脚本,将所有js文件后缀批量改成ts后缀

    做项目的时候准备把js项目重构成ts项目,需要把文件后缀改成ts,一个bat脚本搞定,命令如下: {代码...} 把脚本放到根目录下,双击运行完就可以

  • 一个封装iframe的vue插件,可修改样式,隐藏滚动条

    最近有空,就抽空把以前做过的公司业务组件慢慢抽离出来做成插件,也算是对近年来的技术方面做一个总结吧。 今天要写的是一个用vue-jsx封装的iframe插件,可修改iframe中的样式,隐藏滚动条,默认设置保证页面安全等功能。不想看想直接使用的话请前往项目处 pikaz-iframe , 背景 由于公司爬取了一些文章,需要对

  • 标签: