Vue2.X中创建一个项目,我们基本都会选择Vue官方提供的脚手架工具Vue-cli(也可以基于webpack手动搭建这都没问题),如果想了解Vue-cli创建项目的过程,可以查看Vue-cli创建Vue项目工程步骤详解。
后来尤大新出了Vite,我们可以使用Vite创建项目,但是只能选择官方提供的固定配置的模板,并不能根据项目需要在创建工程时就完成一些必要的配置,好处是支持好多前端框架,但是对我没啥用,因为我只认Vue。
相信大家已经看到了Vue的新版文档了吧。
https://vuejs.org/
在官方文档的快速开始中有这么一段内容(如下图)。
其意思就是告诉大家可以使用新的脚手架create-vue
创建Vue工程了。
下面把create-vue
创建工程的每一步都给大家注释一下(键盘左右键选择Yes
或No
,选定后回车)。
// 项目名称
✔ Project name: … <your-project-name>
// TypeScript的支持
✔ Add TypeScript? … No / Yes
// JSX的支持
✔ Add JSX Support? … No / Yes
// 支持路由
✔ Add Vue Router for Single Page Application development? … No / Yes
// 状态管理
✔ Add Pinia for state management? … No / Yes
// Vitest测试框架
✔ Add Vitest for Unit testing? … No / Yes
// Cypress E2E测试工具
✔ Add Cypress for both Unit and End-to-End testing? … No / Yes
// ESLint代码格式化规范检查
✔ Add ESLint for code quality? … No / Yes
// Prettier代码格式化
✔ Add Prettier for code formatting? … No / Yes
从上面可以看出,create-vue
可以配置对TypeScript的支持,也可以在创建项目是添加路由管理,状态管理,不过需要注意的是在create-vue
当中原来的状态管理已经由Vuex替换为Pinia了。
需要注意的是create-vue
创建的工程已经不是基于webpack
二是基于vite
的。
所以下一代Vuex(Pinia)不学你就out了赶紧学起来。
相比通过Vite
脚手架创建Vue项目,create-vue
在项目创建时就可以解决项目中需要的路由管理、状态管理\代码规范管理等一系列的配置,所以create-vue
的优势在于不需要在项目创建之后一个一个添加相应配置。
所以如果你想要在新的项目中使用Vite、TypeScript、Pinia……,那就用起来。
往期内容已全部收录在专栏中:
Flutter专栏_WEB前端李志杰的博客-CSDN博客文章来源:https://www.toymoban.com/news/detail-449402.html
Vue专栏_WEB前端李志杰的博客-CSDN博客文章来源地址https://www.toymoban.com/news/detail-449402.html
到了这里,关于新一代Vue脚手架(create-vue)的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!