WEB前端

WEB前端包括HTML标签、CSS样式和JS编程等相关的知识。雷雪松的博客WEB前端栏目主要是分享作为WEB前端工程师在WEB前端开发的过程中WEB前端技巧，优秀的JS插件，有趣的JS效果，常用的CSS技巧以及HTML5最新技术。

富文本编辑器vue-quill-editor

WEB前端 Vue.js 2020年7月10日

vue-quill-editor 基于 Vue 和 Quill的富文本编辑器，支持服务端渲染和单页应用，只支持IE10+浏览器。vue-quill-editor非常小巧易用，支持Quill的扩展。下面雷雪松给大家分享一下富文本编辑器vue-quill-editor。
阅读原文 »

G2Plot中的 G2 即意指图形语法 (the Grammar of Graphics)，同时也致敬了 ggplot2。G2Plot是阿里的一套简单、易用、并具备一定扩展能力和组合能力的统计图表 JS 库，基于图形语法理论搭建而成。G2Plot吸引我的优点有：一、代码简单易用。二、大数据展示更智能，避免文本的重叠遮挡、内容无法自适应、内容裁剪等问题。三、提供了多图表组合、叠加、联动，共同讲述一个数据故事的可能性。下面雷雪松带大家一起了解下阿里统计图表库G2Plot。
阅读原文 »

Node零配置服务器之http-server

WEB前端 Nodejs学习 2020年6月16日

http-server是一个简单的零配置Node环境下命令行HTTP静态服务器。在这之前一般常用的HTTP服务器有Apache和Nginx。http-server使用起来非常简单，功能也很强大。http-server可以用于本地调试和开发，也可以用于生产环境。下面雷雪松详细的介绍下Node下http-server的用法。
阅读原文 »

npx 使用教程

WEB前端 Nodejs学习 2020年6月16日

npx是execute npm package binaries的缩写，就是执行npm依赖包的二进制文件，简而言之，就是我们可以使用npx来执行各种命令。npm 从5.2版开始，增加了 npx 命令。npx 主要用于命令行的寻址等辅助功能上，而 npm 是管理依赖的。下面雷雪松给大家分享一下npx 使用教程。
阅读原文 »

ES6 Promise详解

WEB前端 JS开发 2020年6月10日

Promise 是ES6 中一个 JS 的 Promise 类型对象，用来传递异步操作的消息。有了 Promise 对象，就可以将异步操作以同步操作的流程表达出来，避免了层层嵌套的回调函数。此外，Promise 对象提供统一的接口，使得控制异步操作更加容易。Promise 也有一些缺点。首先，一旦新建它就会立即执行，无法中途取消Promise。其次，Promise 内部抛出的错误只通过catch捕获。第三，当处于 Pending 状态时，无法得知进度。下面雷雪松就详细的讲解下 Promise 。
阅读原文 »

RxJS介绍

WEB前端 JS开发 2020年6月10日

RxJS 是 Reactive Extensions for JavaScript 的缩写，是一个基于可观测数据流的响应式编程的库。它是基于订阅-发布模式、观察者模式与迭代器实现的，Vue项目中的 eventbus 就是基于订阅-发布实现的。响应式编程是一种面向数据流和变化传播的编程范式。这意味着可以在编程语言中很方便地表达静态或动态的数据流，而相关的计算模型会自动将变化的值通过数据流进行传播。下面雷雪松给大家介绍一下RxJS。
阅读原文 »

SVG基础知识入门教程

WEB前端 HTML教程 2020年6月4日

SVG 是一种基于 XML 语法的图像格式，全称是可缩放矢量图（Scalable Vector Graphics）。SVG 是属于对图像的形状描述得文本文件，体积较小，放大不会失真，其他图像格式都是基于像素处理的。SVG 文件可以直接插入网页，成为 DOM 的一部分。也可以被img、object、embed、iframe等标签插入网页。SVG 文件也可以在JavaScript 和 CSS 中使用。SVG 文件还可以转为 BASE64 编码，然后作为 Data URI 写入网页。下面雷雪松给大家分享一下SVG基础知识入门教程。
阅读原文 »

截取网页或屏幕快照插件-html2canvas

WEB前端 JS插件 2020年6月2日

html2canvas是一个截取网页或屏幕快照插件。通过读取DOM和元素的不同样式，将当前页面呈现为画布图像。一般在需要将h5页面生成海报的时候用。html2canvas库使用Promise，如果浏览器不支持Promises，可以先加载一个es6-promise的补丁。之前雷雪松的博客中介绍过HTML转图片的JS插件-rasterizeHTML.js。今天雷雪松给大家分享一个截取网页或屏幕快照的插件html2canvas。
阅读原文 »

Three.js介绍

WEB前端 JS开发 2020年6月2日

Three.js 是一款运行在浏览器中的 3D 引擎，你可以用它创建各种三维场景，包括了摄影机、光影、材质等各种对象。Three.js（类似于JQuery）在浏览器提供的 WebGL 接口之上又做了一层封装。WebGL 是在浏览器中实现三维效果的一套标准。WebGL 可以为 HTML5 Canvas 提供硬件 3D 加速渲染，这样 Web 前端开发人员就可以借助系统显卡来在浏览器里更流畅地展示3D场景和模型了，还能创建复杂的导航和数据视觉化。下面雷雪松就简单介绍一下Three.js。
阅读原文 »

JS如何将字符串转化为数字数组

WEB前端 JS开发、Vue.js 2020年5月29日

在使用Vue的时候，我们需要注意数据的类型。比如，Elment select 组件选中的值是有字符串和数值之分的。很多时候，明明给了一个一样的数字，却不能选中就是因为这个原因。那么就需要将字符串数字转换成数字或者将数字转换成字符串。下面雷雪松给大家介绍一下JS如何将字符串转化为数字数组。
阅读原文 »