vue vite教程-vite搭建vue

lxf2023-11-13 08:10:01
摘要

Vite是一个web开发构建工具,由于其原生 ES 模块导入方法,它允许快速提供代码,下面这篇文章主要给大家介绍了关于如何用Vite构建工具快速创建Vue项目的相关资料,需要的朋友可以参考下

目录
  • webpack相比,Vite具有以下特点
  • Vite构建Vue项目
  • 构建过程可能会发生的一些问题
  • 总结

WEBpack相比,Vite具有以下特点

1、快速的冷启动,不需要等待打包

2、即时的热模块更新,真正的按需编译,不用等待整个项目编译完成

Vite构建Vue项目

前提:安装node.js和Vite

第一步通过npm创建Vite项目

npm init vite-app 项目名称
# 例如
npm init vite-app HelloVue

第二步当项目创建成功后,cd到项目目录

cd 项目名称
# 例如
cd HelloVue

第三步安装项目依赖

npm install

第四步运行项目

npm run dev

vue vite教程-vite搭建vue

构建过程可能会发生的一些问题

1、npm install命令很慢或者卡住不动,可以参考:

https://www.jb51.net/article/248533.htm

vue vite教程-vite搭建vue

vue vite教程-vite搭建vue

 2、npm run dev提示“vite不是内部或外部命令”,可能你还没安装vite,可以输入以下命令进行安装。

vue vite教程-vite搭建vue

npm install vite

vue vite教程-vite搭建vue

安装成功再次npm run dev应该就没问题了。

总结

到此这篇关于如何用Vite构建工具快速创建Vue项目的文章就介绍到这了,更多相关Vite快速创建Vue内容请搜索编程网以前的文章或继续浏览下面的相关文章希望大家以后多多支持www.adminjs.cn!