前端工程

手写简单的模块打包器,了解一下

原文地址:https://adamisntdead.com/lets-write-a-module-bundler/ 译文出自:TWNTF 译者:wtzeng 手写简单的模块打包器,了解一下 在 Github 查看源码[1]: Github 你好,欢迎欢迎!很高兴你能来到这。今天,我们来搭建一个非常简单的 Javascript 模块打包器。 在开始之前,我想先明确一个事情,我的这篇文章很大程度上基于这些项目: Unbundling the JavaScript module bundler - Luciano

前端工程

"有条理地"编写带有副作用的 redux action

本文主要是一个代码编写流程的梳理,侧重点在于”有条理”,而不在于相关技术的介绍。目的是为了在编写业务代码时,更加清晰有章法地去做事。下面关于技术的介绍,目的也在于让这些条理更加清晰。 相关技术 redux, redux-actions, redux-saga 场景说明 在最近的一个项目中,使用到了 saga 来处理 redux action 的副作用,当我们需要发起一个有副作用的 action 时,比如需要发起一个 action, 这个 action 会先发起一个网络请求获取数据,获取到数据后,根据返回的结果判断是否需要发起另一个请求,然后再根据返回的结果去更新 redux 的

前端工程

一步步搭建基于 React 技术栈的中型前端项目开发环境(一) --- 基本环境

一步步搭建基于 React 技术栈的中型前端项目开发环境(一) --- 基本环境 2017年12月26日 本文涉及到的技术主要有: React 全家桶,webpack,PostCSS,TypeScript,ImmutableJS。目标是搭建一个基本的开发环境,没有集成测试和协作方面的工具进来。 推荐结合GitHub仓库上的代码阅读本文,如果对环境搭建比较陌生,这篇文章很详细,可以按照本文一步步地进行下去。为了体现这些步骤,代码是增量变化的,但是为了展现每块内容的完整性,很多地方都不是只写增量,而是写了完整的代码块,配合代码块附近的说明和代码块内的注释,应该会更容易理解增量所在,同时因为这个原因,文章看起来很长,实际上读起来没有看上去那么长的,只看增量就好了。 (增量用 "

前端工程

Yarn的Linking dependencies特别慢的优化方法

通过以下方法,可以提升部分速度: 把项目文件夹添加进杀毒软件的白名单 把Yarn的缓存文件夹(yarn cache dir查看路径)添加进杀毒软件白名单 把Yarn的安装目录添加进杀毒软件白名单 把Node.exe添加进杀毒软件白名单 总的来说,就是把Yarn,Node和项目相关的文件夹添加进杀毒软件的白名单速度就会有一定的提升。从我自己的实际实验来看,提升了接近一半的速度。

前端工程

Knockout.js快速学习笔记

原创纯手写快速学习笔记(对官方文档的二手理解),更推荐有时间的话读官方文档 框架简介(Knockout版本:3.4.1 ) Knockout(以下简称KO)是一个MVVM(Model-View-View Model)框架,这是一种设计用户界面的设计模式,把一个复杂的UI分成三个部分:模型(Model),视图(View),视图模型(View Model)。以下解释这三个模型的含义: 模型(Model):你的应用中存储的数据。这些数据与UI是独立的。我们常向服务器发请求,从而得到数据改变模型存储的数据。 视图模型(View Model)

前端工程

简单利用jQuery,让前端开发不再依赖于后端的接口

前端开发的过程中,我们免不了和后端进行联调,这时候就会出现以下的尴尬场景: 接口没写好,没法做接下来的功能 功能写好了,接口没写好,没法测这个功能 联调了,出了BUG,不知道锅在谁身上,只得陪后端耗时间 要解决这个问题,可以使用功能强大的mockjs,它能拦截AJAX请求并返回规定好的假数据。但是这需要学习mockjs的语法,且由于我之前不知道这个强大的东西的存在,只好自己摸索出了一种让前端开发不再依赖于后端的方法: 需要的工具:jQuery, tomcat(http-server也可以,但要注意http-server请求本地数据时不能用post方法,只能get), webstorm(可选) 这个方法的关键在于,jQuery的ajax函数可以请求本地的json数据,于是我们可以这么做。 var whatMode = 'dev' // 指明使用开发模式还是生产模式的变量,