市面上现在有很多bundler,最著名的就是webpack,此外常见的还有 browserify,rollup,parcel等。虽然现在的bundler进化出了各种各样的功能,但它们都有一个共同的初衷,就是能给前端引入模块化的开发方式,更好的管理依赖、更好的工程化。
沪江CCtalk视频地址:https://www.cctalk.com/v/15114923883523 log 日志中间件 最困难的事情就是认识自己。 在一个真实的项目中,开发只是整个投入的一小部分,版本迭代和后期维护占了极其重要的部分。项目上线运转起来之后,我们如何知道项目运转的状态呢?如何发现线上存在的问题,如何及时进行补救呢?记录日志就是解决困扰的关键方案。正如我们每天写日记一样,不仅能够记录项目每天都做了什么,便于日后回顾,也可以将做错的事情记录下来,进行自我反省。完善的日志记录不仅能够还原问题
为了达到所有页面在用户端达到秒开,也就是网络(JS Bundle下载)和首屏渲染(展现在用户第一屏的渲染时间)时间和小于1s。
它是一个将一切资源(如scripts / images / styles/ assets)都当成模块的模块化打包工具。
上一篇Vite入门从手写一个乞丐版的Vite开始(上)我们已经成功的将页面渲染出来了,这一篇我们来简单的实现一下热更新的功能。
实例:我在公用文件夹src下的js文件夹中创建的三个保存全局变量的文件:base64.js、config.js、data.js
概述上一篇我们描述了为什么我们要使用胶水语言(JavaScript,PikaScript)来改变我们的嵌入式开发模式。并描述了如何在嵌入式设备拉起JavaScript应用及JavaScript应用在嵌入式设备的存在形式(字符串,文件)。打破单片机开发模式--胶水语言(JavaScript) 胶水语言可以让我们职责更加明确,可以类前后端开发模式,后端负责--硬件的适配,方法的导出;前端负责--业务逻辑的的开发。本篇文章作者来介绍JS在嵌入式设备上的如何使用,我们通过一下几点说明:C端如何导出方法提供给到JS端
数组是一组数据的集合,其中每个数据被称作数组的元素,在数组中可以存放任意数据类型的数据
生成器函数在 JavaScript 中的出现早于引入 async/await,这意味着在创建异步生成器(始终返回 Promise 且可以 await 的生成器)的同时,还引入了许多需要注意的事项。
Webpack在前端前端构建工具中可以堪称中流砥柱般的存在,日常业务开发、前端基建工具、高级前端面试...任何场景都会出现它的身影。
Webpack 是前端很火的打包工具,它本质上是一个现代 JavaScript 应用程序的静态模块打包器(module bundler)。当 Webpack 处理应用程序时,它会递归地构建一个依赖关系图(dependency graph),其中包含应用程序需要的每个模块,然后将所有模块打包成一个或多个 bundle。
在前端开发中,JavaScript是必不可少的一部分,而掌握各种常用的公共方法更是提升开发效率和代码质量的关键。无论你是初学者还是资深开发者,了解并熟练运用这些方法都能让你的代码更加简洁、高效。本篇博客将为你详细汇总并解析最全的JavaScript公共方法,涵盖数组、对象、字符串、日期等各个方面的常用技巧。希望通过这篇文章,能为你的前端开发之路提供有力的帮助,成为你开发过程中不可或缺的参考指南。
ECMAScript模块(简称ES模块)是一种JavaScript代码重用的机制,于2015年推出,一经推出就受到前端开发者的喜爱。在2015之年,JavaScript 还没有一个代码重用的标准机制。多年来,人们对这方面的规范进行了很多尝试,导致现在有多种模块化的方式。
它更类似于 webgl 编译着色器代码,需要调用 JavaScript 提供的 API 去编译执行。
前一段时间我把webpack源码大概读了一遍,webpack 到4.x版本后,其源码已经比较庞大,对各种开发场景进行了高度抽象,阅读成本也愈发昂贵。
事件钩子会有不同的类型 SyncBailHook,AsyncSeriesHook,SyncHook等
本文最终实现的简易版 vite 可通过github 地址(https://github.com/levelyu/simple-vite)下载,代码实现地较为简单(不到 100 行)可运行后再看此文,阅读效果可能更佳~
笔者前公司用的是think.js作为后端框架,初次使用,深感业务场景的傻瓜式。它就是一个基于koa二次开发。一个显著的特点就是可以在对应文件夹下直接书写接口。比如api /aaa/对应 aaa文件夹下的index。/bbb/aaa/user对应bbb文件夹下的 aaa.js下等 user方法等。
sequelize这个包专门用于项目中处理关系型数据库的操作,它是基于 promise 的
01 前 言 在项目开发中,经常需要import或者export各种模块 经常会这样引入组件: import A from 'components/A' import B from 'componen
你是不是在想,这需求俺根本不用koa、koa-router,原生的node模块就可以搞定。
在最近的工作中,接手了一个古老的项目,其中的 JS 代码是一整坨的面条代码,约 3000 行的代码全写在一个文件里,维护起来着实让人头疼。 想不通为啥之前维护项目的同学能够忍受这么难以维护的代码……既然现在这个锅被我拿下了,怎么着也不能容忍如此丑陋的代码继续存在着,必须把它优化一下。 横竖看了半天,由于逻辑都揉在了一个文件里,看都看得眼花缭乱,当务之急便是把它进行模块化拆分,把这一大坨面条状代码拆分成一个个模块并抽离成文件,这样才方便后续的持续优化。 一、结构分析 说干就干,既然要拆分成模块,首先就要
Node.js 是一种基于 JavaScript 的服务器端编程语言,而 MongoDB 是一个流行的 NoSQL 数据库。Node.js 可以与 MongoDB 集成,从而创建强大的 Web 应用程序。本文将详细介绍如何使用 Node.js 连接和操作 MongoDB 数据库。
介绍 使用koa搭建node服务 并连接mongodb返回前端数据 git https://gitee.com/wjj0720/koa... 项目初始化 首先保证你的node环境已经就绪 1、创建项目文件夹 创建文件夹test,在文件夹中shift+右键 在此处运行命令行 运行 npm init --y 2、 安装依赖 npm i koa koa-body koa-static koa-cors 创建服务 // server.js /* * 1、在项目文件中创建一个server.js文件
我们创建了add.js文件和minus.js文件,然后 在index.js中引入,再将index.js文件引入index.html。
掌握fs同步方法 使用path 在测试代码目录创建目录data,创建文件data/class.js //class .js 文件 module.exports={ fun1:()=>'run fun1', fun2:()=>'run fun2' } 创建data/fun.js //fun.js module.exports=()=>'function run' 创建文件testNow目录,创建index.js写功能 const path = require('path'); const fs
JS 中使用正则表达式的方法比较多,可以按照使用两种类型记忆: 字符串对象方法、正则表达式对象方法
解析XML文件是开发中常见的需求之一。为了以一种简单易用的方式访问XML数据,你可能不想编译一个C解析器,而是想寻找一个更方便的解决方案。那么,xml2js就是你需要的工具!xml2js是一个简单的XML到JavaScript对象转换器,支持双向转换。它使用了sax-js和xmlbuilder-js这两个工具库。
Node.js 中使用 ES6 中的 import / export 的方法大全
最近用Next.js + Editor.js 撸了一个博客系统。开发起来甚是畅滑,如果你喜欢React,又有同构的需求,不妨由此文入手。
当我们用 Typesript 来写 Node.js 的代码,写完代码之后要用 tsc 作编译,之后再用 Node.js 来跑,这样比较麻烦,所以我们会用 ts-node 来直接跑 ts 代码,省去了编译阶段。
自己运营了一个公众号,在发文章的时候,需要在网上找一些图,而有些网站的图片可能隐藏在属性或者背景图中,要下载的时候经常审查元素,查看源码,不太方便,最近在看一些谷歌插件的api,便顺手做了一个插件Im
这里声明一下,这不是反jQuery的文章,这里我想告诉大家,我持有的观点是在中小型的项目中建议能不用jQuery就不用。 背景知识 在所有的现代浏览器(IE9+)里,它们所提供的原生DOM API都是
无论是前端开发者还是后端开发者,都会在项目中封装一些经常使用的功能方法,可以大大提高我们的开发效率
众所周知,JavaScript 是单线程的语言。当我们面临需要大量计算的场景时(比如视频解码等),UI 线程就会被阻塞,甚至浏览器直接卡死。现在前端遇到大量计算的场景越来越多,为了有更好的体验,HTML5 中提出了 Web Worker 的概念。Web Worker 可以使脚本运行在新的线程中,它们独立于主线程,可以进行大量的计算活动,而不会影响主线程的 UI 渲染。当计算结束之后,它们可以把结果发送给主线程,从而形成了高效、良好的用户体验。Web Worker 是一个统称,具体可以细分为普通的 Worker、SharedWorker 和 ServiceWorker 等,接下来我们一一介绍其使用方法和适合的场景。
上一节讲解了迭代器的使用,如果对迭代器还不够了解的可以在回顾下《从理解到实现轻松掌握 ES6 中的迭代器》,目前在 JavaScript 中还没有被默认设定 [Symbol.asyncIterator] 属性的内建对象,但是在 Node.js 中已有部分核心模块(Stream、Events)和一些第三方 NPM 模块(mongodb)已支持 Symbol.asyncIterator 属性。本文也是探索异步迭代器在 Node.js 中的都有哪些使用场景,欢迎留言探讨。
众所周知,js 是一门非常灵活的语言。当我们在 js 中调用一个函数时,经常会给函数传递一些参数,js 把调用函数时传入的全部实参存储到一个叫做 arguments 的类数组对象里面
JS 是脚本语言,脚本语言都需要一个解析器才能运行。对于写在 HTML 页面里的 JS,浏览器充当了解析器的角色。而对于需要独立运行的 JS,NodeJS 就是一个解析器。
在日常使用 Node 进行开发的时候,会使用到一些文件系统、路径操作等基础 API,这里整理一下,方便大家理解和直接使用。
对于一个应用程序来说,日志记录是非常重要的。日志可以帮助开发人员快速定位线上问题,定制解决方案;日志中包含大量用户信息,通过日志分析还可以获取用户行为、兴趣偏好等信息,通过这些信息可以得到用户画像,对公司战略的制定提供参考。本文将要介绍如何在node服务中处理日志。
今天我们来深度分析一下 Commonjs 和 Es Module,希望通过本文的学习,能够让大家彻底明白 Commonjs 和 Es Module 原理,能够一次性搞定面试中遇到的大部分有关 Commonjs 和 Es Module 的问题。
最近在公司遇到了一个需求,别的团队的同事想将他们用 React 编写的工程作为子系统集成到我们已有的系统中,React 工程是基于 umi 框架编写的,我们的主系统是基于 jquery 框架实现的。其实他们本来是已经实现了 React 作为子系统集成到我们的主系统中的,但是他们是借助于 iframe 实现页面嵌入的,后来因为用户体验不佳、存在安全性问题等因素而不得不放弃这种方式的集成了。
在文件或者目录被添加,删除或者更新时,能够收到消息通知,这个能力对我们来说还是非常重的。
熟悉我的人应该知道,虽然现在我一直主力于 Flutter, 但是 GSY App 系列项目最早其实是 React Native , 之后才是 Weex 和 Flutter , 所以其实我对 RN 一直有着“初恋”的情节,基本上是它带着我走进前端和跨平台的领域,而恰巧最近看到了关于它的消息,就顺便了解下多年后它又有什么升级。
众所周知,Vue.js 中一个很重要的知识点是组件通信,不管是业务类的开发还是组件库开发,都有各自的通讯方法。
领取专属 10元无门槛券
手把手带您无忧上云