526互联

现代前端开发的关键库和工具一览

发布时间 2023-09-07 14:37:50作者: 优前程

JavaScript 工具库/函数库

  • Lodash：Lodash 是一个 JavaScript 实用工具库，提供了许多用于数组、对象、函数等常见操作的函数。
  • Ramda：Ramda 是一个为函数式编程设计的 JavaScript 工具库。

Vue.js 工具和库

  • Vue.js：Vue.js 是一个渐进式 JavaScript 框架，用于构建用户界面和单页面应用程序。
  • @vueuse/core：VueUse 提供了一系列 Vue Composition API 的实用函数。
  • Vuex：Vuex 是 Vue.js 的状态管理模式和库。
  • Vue Router：Vue Router 是 Vue.js 的官方路由管理器。
  • vue-i18n：vue-i18n 提供了 Vue.js 的国际化解决方案。
  • Vue Draggable：Vue Draggable 是一个基于 Sortable.js 的 Vue 组件，用于拖放排序。
  • Vue Animation：Vue 自带的过渡效果和动画系统。
  • Vue Meta：Vue Meta 提供了管理 Vue 应用程序的 meta 信息的能力。
  • Vue Page Transition：Vue Page Transition 提供了页面之间的过渡动画。
  • Vue Devtools：Vue Devtools 是一个用于调试 Vue.js 应用程序的浏览器扩展程序。

CSS 框架和工具

  • tailwindcss：Tailwind CSS 是一个实用性首先的 CSS 框架。
  • windicss：WindiCSS 是一个高效、强大的 Tailwind CSS 编译器。
  • Sass：Sass 是一种稳健、成熟、专业的 CSS 扩展语言。
  • Less：Less 是一个 CSS 预处理器。
  • Stylus：Stylus 是一个富有表现力的、动态的、健壮的 CSS 预处理器。
  • PostCSS：PostCSS 是一个用 JavaScript 工具和插件转换 CSS 代码的工具。

UI 框架

  • Ant Design：Ant Design 是一个为 React 提供的企业级 UI 设计语言和前端框架。
  • Material-UI：Material-UI 是一个流行的 React UI 框架，遵循 Google 的 Material 设计规范。
  • Bootstrap：Bootstrap 是最流行的 HTML、CSS 和 JS 框架，用于开发响应式布局和移动优先的 Web 项目。
  • Bulma：Bulma 是一个基于 Flexbox 的现代 CSS 框架。
  • Semantic UI：Semantic UI 是一个开发框架，有许多预设计的界面元素。
  • vant：vant 是一个为移动端提供的轻量、可靠的组件库。
  • ElementUI：ElementUI 是一个为 Vue.js 提供的高质量组件库，适用于桌面应用。

代码质量和静态分析

  • ESLint：ESLint 是一个开源的 JavaScript 代码检查工具，用于识别和报告模式中的问题。
  • TSLint：TSLint 是一个弃用的静态代码分析工具，用于检查 TypeScript 代码的可读性、功能性和可维护性。
  • stylelint：stylelint 是一个强大的现代 linter，用于检查样式表的错误和固定的风格。
  • commitlint：commitlint 是一个工具，它可以帮助开发者维持一致的 git 提交规范。

HTTP 请求库

  • axios：Axios 是一个基于 promise 的 HTTP 客户端，用于浏览器和 node.js。

日期处理库

  • moment.js：Moment.js 是一个处理日期和时间的 JavaScript 库。
  • day.js：Day.js 是一个轻量级的 JavaScript 日期库，与 Moment.js 的 API 兼容。

测试工具和框架

  • Jest：Jest 是一个让 JavaScript 测试变得简单的测试框架。
  • Mocha：Mocha 是一个在 Node.js 和浏览器上运行的 JavaScript 测试框架。
  • Chai：Chai 是一个 BDD / TDD 断言库，可与任何 JavaScript 测试框架一起使用。
  • Cypress：Cypress 提供了一个为 Web 写测试的更好的方式。
  • Selenium：Selenium 是一个浏览器自动化工具。
  • Testing Library：Testing Library 提供了一系列用于测试 JavaScript 和 React 的实用程序。

打包工具

  • Webpack：Webpack 是一个模块打包器。
  • Rollup：Rollup 是一个 JavaScript 模块打包器。
  • Parcel：Parcel 是一个 Web 应用打包器，提供了极快的性能和零配置。

JavaScript 编译器

  • Babel：Babel 是一个 JavaScript 编译器，主要用于将 ES6+ 代码转换为向后兼容的 JavaScript 版本。

状态管理库

  • Redux：Redux 是一个可预测的状态容器，用于 JavaScript 应用程序。
  • MobX：MobX 是一个简单、可扩展的状态管理库。

动画库

UI 组件库

  • React Bootstrap：React Bootstrap 是 Bootstrap 的 React 版本。
  • Vuetify：Vuetify 是 Vue.js 的 Material Design 组件框架。

数据可视化

  • D3.js：D3.js 是一个用于数据驱动文档的 JavaScript 库。
  • Chart.js：Chart.js 提供了简单、灵活的数据可视化工具。

3D 引擎和库

  • Three.js：Three.js 是一个跨浏览器的 JavaScript 库和 API，用于创建和显示动画 3D 计算机图形。

其他工具和库

  • lodash/fp：lodash/fp 是 Lodash 库的函数式编程风格的版本。
  • Prettier：Prettier 是一个自动代码格式化工具。
  • TypeScript：TypeScript 是一个 JavaScript 的静态类型超集，可以编译为纯 JavaScript。