目录1. 创建3.0项目Vite 与 Vue-cli 是什么?Vue-cli 的特点:Vite 的特点:Vite 和 Vue-cli的区别:总结:1. 创建3.0项目 vue-cli
vue-cli : 安装并执行 npm init vue@latest
选择项目功能时: 除了第一项的项目名字外,其他可以暂时No
cd title
npm install
npm run dev :运行
npm run build: 打包 (生成一个dist文件夹)
vite: 使用vite 体验更快速
npm init vite-app title
cd title
npm install
npm run dev
title 代表创建 vue3 项目的文件夹名称
Vue-cli 基于WEBPack构建,配置好了打包规则
有丰富的官方插件合集,站在webpack庞大的社区资源上
友好的图形化创建和管理Vue项目界面 : vue ui
vue-cli在(前端)服务启动之前,要把所有代码打包成Bundle再启动服务,这也是为什么一个些大型项目 启动时,特别慢的原因。这一点在Vite做了大幅度改善。
Vite是Vue团队开发的新一代前端开发与构建工具,vite不是基于webpack,
它为了解决项目启动慢的问题,vite通过一开始将应用中的模块分为依赖和源码两类,改进了开发服务器的启动慢的特点;
依赖: 大多为在开发时,不会变动的纯js,一些较大的依赖(例如有上百个模块的组件库:element-ui) ,处理的代价很高。依赖通常会存在多种模块化的格式.vite会使用esbuild预构建依赖,esbuld使用Go编写,并且比 js编写的打包器,速度快10-100倍;
源码: 通常包含一些并非直接是js的文件,需要转换,时常被编译。同时,并不是所有的源码都需要同时被加载。(例如:基于路由拆分的代码模块)。
以上: 这就是为什么vite启动快的原因;
以上就是 vue3 中Vite 和 Vue-cli的特点和区别。
到此这篇关于Vue3中Vite和Vue-cli的特点与区别的文章就介绍到这了,更多相关Vue3 Vite和Vue-cli区别内容请搜索编程网以前的文章或继续浏览下面的相关文章希望大家以后多多支持编程网!
--结束END--
本文标题: Vue3中Vite和Vue-cli的特点与区别详解
本文链接: https://www.lsjlt.com/news/176083.html(转载时请注明来源链接)
有问题或投稿请发送至: 邮箱/279061341@qq.com QQ/279061341
下载Word文档到电脑,方便收藏和打印~
2024-01-12
2023-05-20
2023-05-20
2023-05-20
2023-05-20
2023-05-20
2023-05-20
2023-05-20
2023-05-20
2023-05-20
回答
回答
回答
回答
回答
回答
回答
回答
回答
回答
0