awesome-f2e-libs 介绍
整理我平时关注的前端库。
打包工具
webpack - 打包项目。rollup - 打包 npm 库。parcel - webpack 竞品,但发展前景不乐观,再观察一段时间。@pikapkg/pack - 又一组件打包工具。systemjs - 针对一些特殊场景会比较有用,比如云 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 打包工具。pikapkg/web - 浏览器里跑 npm 依赖,面向现代浏览器。lebab/lebab - 把 es5 代码转成 es6,反向 babel。palmerhq/tsdx - Zero-config CLI for TypeScript package development.webpack loader 和插件
hard-source-webpack-plugin - 性能提升 70%,但有坑。
svgr - svg 转 react 组件。
postcss - css 界的 babel。
autoprefixer - 为 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。
copy-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,Redux 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 - 时间处理。
数据流
redux
immer
mobx
unstated
rxjs
dva - 我写的数据流,基于 redux。
rematch - 基于 redux。
vuex
ngrx
redux 扩展
react-redux - 绑定 react 和 redux。
redux-saga
redux-persist
redux-bundler
redux-box
性能优化
workbox - PWA 方案,Google 出品。
critical - 提取关键 css。
语言
typescript
flow
graphql
文档
vuepress
docz
storybook
mdx - jsx + markdown。
工程
lerna - monorepo 管理。
lerna-changelog - 为 lerna 项目自动生成 changelog。
eslint - js 风格约束。
eslint-config-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-interactive 配合着用,主要用来检测冗余依赖。
cpx - 复制,支持 glob,并且可以 watch。
onchange - 监听文件变动然后做一些事。
just - 微软出的任务管理器。
tern - 代码分析器,为不少编辑器服务。
编辑器
VSCode
IntelliJ IDEA - 我用这个。
codesandbox
stackblitz
CloudIDE
theia
che
codesandbox-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 处理命令行输出。
figures - ✔︎ 等特殊字符,做了 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全部内容。
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。