awesome-f2e-libs 介绍
整理我平时关注的前端库。
打包工具
webpack ?- 打包项目。 rollup ?- 打包 npm 库。 parcel ?- webpack 竞品，但发展前景不乐观，再观察一段时间。 @ pika pkg/pack ?- 又一组件打包工具。 sy stem js ?- 针对一些特殊场景会比较有用，比如云 ide，支付宝 小程序 IDE 等。 microbundle ?- 基于 rollup，简化配置。 bili ?- 基于 rollup，同上。 webpack-dev-server ?- webpack 开发服务器。 webpack-dev-middleware ?- webpack 中间件。 vue-cli ?- vue 命令行工具。 create-react-app ?- react 官方脚手架。 webpack-merge ?- 合并 webpack 配置。 webpack-chain ?- 通过 chain 风格 api 的方式 修改 webpack 配置。 prepack ?- 通过预先执行的方式优化打包结果。 swc ?- 基于 rust 的语法转换器，babel 的竞争者。 nathan/ pax ?- 基于 rust，据说是这个星球最快的 JavaScript 打包工具。 pika pkg/web ?- 浏览器里跑 npm 依赖，面向现代浏览器。 lebab/lebab ?- 把 es5 代码 转成 es6，反向 babel。 palmerhq/tsdx ?- Zero-con fig CLI for TypeScript package development.webpack loader 和 插件
hard-source-webpack-plugin ?- 性能 提升 70%，但有坑。
svgr ?- svg 转 react 组件。
postcss ?- css 界的 babel。
a utop refixer ?- 为 css 选择权 自动 加 prefix。
cssnano ?- css 压缩，也有类 preset 的概念。
mini- css- extract-plugin ?- 提取 css 为单独 文件 。
webpackbar ?- webpack 进度条。
webpack-bundle -analyzer ?- 构建产物占比分析。
uglifyjs-webpack-plugin ?- js 压缩，产物为 ES5 语法。
terser-webpack-plugin ?- js 压缩，产物为 ES6 语法。
webpack-manifest-plugin ?- 生成 manifest.json。
cop y-webpack-plugin ?- 复制额外的 文件 到 输出 目录。
case-sensitive-paths-webpack-plugin ?- 大小写敏感检测，能规避一些问题，但构建时 性能 消耗较大。
css- hot-loader ?- css 热更新，搭配 mini- css- extract-plugin 使用。
duplicate-package-checker-webpack-plugin ?- 重复依赖检测。
fork-ts-checker-webpack-plugin ?- ts 语法检测。
speed-measure-webpack-plugin ?- 统计 webpack 各阶段耗时。
包管理
yarn ?- 我用这个。
npm
babel
babel
babel-plugin-rawest ?- react 的 DOM 直出方案。
babel-plugin-macros ?- 前端 文件 写 node 逻辑。
babel-plugin-dynamic-import-node ?- 有些场景下会需要禁用?import()?语法。
babel-plugin-react-require ?- 自动 为 jsx 语法加 react 引用。
babel-plugin-transform-react-remove-prop-types ?- 删除 prop-types，生产环境用。
测试
jest
ts-jest
enzyme
jsdom
puppeteer
react-test-rerender ?- 官方出品。
react-testing-library ?- kentcdodds 出品。
框架
react
vue
next.js
nuxt.js
gastby
umi ?- 蚂蚁金服的前端框架，我目前在维护。
rekit ?- IDE and toolkit for building scalable web applications with react,R edux and react-router.
choo ?- dva 最初的 API 是参考这个实现的，已经不怎么发展了，再关注一段时间。
Taro ?- 用 react 写 小程序 ，适配微信和支付宝等。
after.js
mint ?- 提供了语言层方案的框架。
quasar ?- 基于 vue，一套 代码 多处适用。
react 相关库
preact ?- 轻量级 react 实现。
inferno ?- 轻量级 react 实现。
react-router ?- React 路由方案。
reach-router ?- React 路由方案，较新，优势是可访问性。
router5 ?- 通用的路由方案。
react-loadable ?- 按需加载 react 组件。
ant-design ?- 蚂蚁金服的 React UI 库。
material-ui ?- UI 库。
react-intl ?- React 的国际化方案。
react-dnd ?- 拖拽实现。
react-helmet ?- 修改 html 的 header 内容 。
react-jsonschema-form ?- A React component for building Web forms from jsON Schema.
vue 相关库
vue-router
工具类
history
path-to-regexp ?- path 转正则，路由相关处理的底层库。
lodash ?- 工具集合。
fastclick
date-fns ?- 时间处理。
数据流
r edux
immer
mobx
unstated
rxjs
dva ?- 我写的数据流，基于 r edux 。
rematch ?- 基于 r edux 。
vuex
ngrx
r edux 扩展
react-r edux ?- 绑定 react 和 r edux 。
r edux -saga
r edux -persist
r edux -bundler
r edux - Box
性能 优化
work Box ?- PWA 方案，Google 出品。
critical ?- 提取 关键 css。
语言
typescript
flow
graphql
文档
vuepress
docz
storybook
mdx ?- jsx + markdown。
工程
lerna ?- mo nor epo 管理。
lerna-changelog ?- 为 lerna 项目 自动 生成 changelog。
eslint ?- js 风格约束。
eslint-con fig -airbnb
xo ?- 封装自 eslint。
prettier ?- 更主观的风格 自动 修改 。
yeoman-generator ?- 脚手架工具。
serve ?- 本地静态服务器。
servor ?- 另 一个 静态服务器。
budo ?- 又 一个 静态服务器。
np ?- npm publish 辅助， 自动 push、打 tag、升版本等。
lint-staged ?- eslint 提速，只 lint 提交的 代码 。
coveralls ?- 覆盖率。
husky ?- 添加 git hooks。
cross-env ?- 跨平台的环境变量声明。
projj ?- 本地 git 项目管理， 支持 github 和 gitlab。
nvm ?- 管理 node 版本。
concurrently ?- 在 npm scripts 里并行执行命令。
@zeit/ncc ?- 打包为 npm 包为 一个 文件 。
npm-check ?- 检测依赖 升级 情况，我会和 yarn upgrade-in tera ctive 配合着用，主要用来检测冗余依赖。
cpx ?- 复制， 支持 glob，并且可以 watch。
onchange ?- 监听 文件 变动然后做一些事。
just ?- 微软出的任务管理器。
tern ?- 代码 分析器，为不少编辑器服务。
编辑器
VSCode
IntelliJ IDEA ?- 我用这个。
codesand Box
stackblitz
CloudIDE
theia
che
codesand Box -client
字体
FiraCode
Dank Mono
Operator Mono
css
css modules
emotion
命令行
yargs ?- 命令行入口套件。
yargs-parser ?- 命令行参数解析。
chalk ?- 输出 不同颜色。
cheerio ?- 用类 jQuery 语法处理 html。
chokidar ?- 文件 监听。
clipboardy ?- 复制文本到粘贴板。
debug ?- 打印调试信息。
deprecate ?- 给过期警告。
glob ?- 文件 查找。
tiny-glob ?- 文件 查找。
signale ?- 漂亮的日志打印。
semver ?- semver 版本处理。
update-notifier ?- 更新提醒。
rimraf ?- 删除 文件 。
depd ?- 给出 deprecated 警告。
execa ?- 比 child_process 好用，返回 Promise。
ora ?- 控制命令行光标， 显示 loading 等。
inquirer ?- 交互式命令接口，比如 prompt。
enquirer ?- 同上，更 cool 一些。
ajv ?- 参数校验 。
ink ?- 用 React 处理命令行 输出 。
fig ures ?- ?? 等特殊字符，做了 windows 兼容处理。
请求处理
whatwg-fetch
got
axios
request
reqwest
压缩解压缩
yazl ?- zip 压缩。
yauzl ?- zip 解压缩。
tar-fs ?- tar 的压缩和解压缩。
语法解析
esquery ?- 语法树 查询 。
Markdown
remark ?- Markdown 语法解析器。
markdown-it ?- Markdown 转 html。
其他
electron
DeskGap ?- 类 electron，由于不包含浏览器的部分，所以产物更小
fx ?- 交互式 jsON 查看。
rtfs
reactjs/rfcs
eslint/rfcs
vuejs/rfcs
yarnpkg/rfcs
npm/rfcs
gastbyjs/rfcs
nuxtjs/rfcs
GitHub: https://github.com/sorrycc/awesome-f2e-libs
网站描述: 整理我平时关注的前端库
awesome-f2e-libs官方网站
官方网站：
如果觉得 网站内容还不错，欢迎将 网站 推荐给程序员好友。
查看更多关于awesome-f2e-libs的详细内容...