Vue CLI 是一个基于 Vue.js 进行快速开发的完整系统,致力于将 Vue 生态中的工具基础标准化。它确保了各种构建工具能够基于智能的默认配置即可平稳衔接,这样你可以专注在撰写应用上,而不必花好几天去纠结配置的问题。与此同时,它也为每个工具提供了调整配置的灵活性,无需 eject。
Vue CLI 是一组用于快速原型设计、简化应用程序搭建和进行高效项目管理的工具。它由三个主要的工具组成:
- CLI 是一个 npm 包,通过 vue 命令提供核心功能。它可以帮我们轻松地构建一个新项目(vue create)或者快速创建原始构思(vue serve)。如果我们想要对项目进行更具体和可视化的控制,可以通过运行 vue ui 命令打开 CLI 的 GUI。
- CLI Service 是一个开发依赖项(vue-cli-service 二进制文件),安装在使用 CLI 创建的每个项目中。它可以帮助我们开发项目(vue-cli-service serve)、打包(vue-cli-service build),以及检查内部 Webpack 项目的配置(vue-cli-service inspect)。
- CLI 插件也是 npm 包,为项目提供额外的功能。它们的名字以 @vue/cli-plugin-(内置插件)或 vue-cli-plugin-(社区插件)开头。我们可以在开发过程中通过 vue add 命令添加它们。
后面我们将探讨上述工具和实用程序的所有细节,但现在先让我们看看 Vue CLI 这些强大而灵活的功能。
Vue CLI 是一个用于提升 Vue.js 开发工作流程的全功能系统
Vue CLI 凭借其丰富的功能集,可加速和简化 Vue.js 项目开发。让我们看看它都有哪些功能:
- 基于插件的架构。Vue CLI 完全围绕插件而构建,所以非常灵活和可扩展。我们可以选择在项目创建过程中添加哪些内置插件,还可以在创建项目后随时添加任意数量的插件。
- Vue CLI 完全可配置、可扩展和可升级。
- 提供了一系列官方预装插件,集成了前端生态系统的一流工具(Babel、ESLint、TypeScript、PWA、Jest、Mocha、Cypress 和 Nightwatch)。
- 一个默认预设,我们可以在项目创建期间或之后根据我们的需求进行修改。
- 无需弹出。与 React 和 Angular CLI 工具相比,我们可以在创建项目后随时安全地检查和调整项目的 Webpack 配置,无需弹出应用程序并切换到手动配置。
- 多页面支持。
- 无需任何配置即可进行即时原型设计。
不同的构建目标可以生成不同版本的项目——我们可以使用同一个代码库构建 App、库或 Web 组件。 - 现代模式功能。构建适用于现代浏览器的应用程序,同时兼容旧版本的浏览器。
- 一个完整的 GUI,可轻松创建、更新和管理复杂项目。
- UI 插件 API。Vue UI 公开了一个插件 API,我们可以用它将自定义功能添加到 CLI 的 GUI 版本中。