禁止用户调试网站

web想禁止调试，没有绝对安全的方式

妙用1 debugger

示例

用setInterval执行debugger，打开控制台就会暂停代码

1
2
3
4
5
6
7
8

(() => {
  function ban() {
    setInterval(() => { 
      debugger;
    }, 50);
  }
  ban();
})();

串行 or 并行

并行跑命令：&，在命令结尾加& wait，可以使用ctrl c关闭命令行来结束进程
串行跑命令：&&

控制日志输出

• –silent（-s）：输出尽可能少的日志
• –verbose：显示尽可能多的状态，日志级别的输出，用于调试

github地址：https://github.com/developit/mitt

200b大小的event bus库

本文不会放api的用法，建议先看看是怎么用的

项目架构

采用monorepo的形式，项目目录下有多个子项目，下面放了资料链接和几处用法，其他本文不多赘述。

现代前端工程为什么越来越离不开 Monorepo?
为什么使用pnpm可以光速建立好用的monorepo（比yarn/lerna效率高）
pnpm workspace文档

crossvent：封装跨平台事件绑定的库

跨平台的触摸事件

利用crossvent封装绑定跨平台拖拽事件的方法touchy，以便支持移动端和pc端

根据环境获取的触摸事件名，用懒加载的方式替换掉touchy函数，之后绑定事件不需要再判断

Redux 官方文档对 Redux 的定义是：一个可预测的 JavaScript 应用状态管理容器

安装

1

npm install --save redux

函数式组件只能使用props，Hook能够在函数式组件的情况下使用state、生命周期以及其他的React特性

为什么需要引入React Hook，可以查看官方文档：https://zh-hans.reactjs.org/docs/hooks-intro.html#motivation

• react-router：路由核心库，包含诸多和路由功能相关的核心代码
• react-router-dom：利用路由核心库，结合实际的页面，实现跟页面路由密切相关的功能

安装

1
2
3

# react-router-dom依赖react-router
# 安装的时候会把react-router一起安装了
npm install react-router-dom -S

1. 设计思想

1. React 设计思想
2. React的设计哲学 - 简单之美
3. 颠覆式前端UI开发框架:React

引入

如果用最初始的setTimeout递归实现定时器，一秒执行一次回调，则代码如下