iis服务器助手广告广告
返回顶部
首页 > 资讯 > 前端开发 > JavaScript >如何用Vite构建工具快速创建Vue项目
  • 679
分享到

如何用Vite构建工具快速创建Vue项目

2024-04-02 19:04:59 679人浏览 独家记忆
摘要

目录和webpack相比,Vite具有以下特点Vite构建Vue项目构建过程可能会发生的一些问题总结和WEBpack相比,Vite具有以下特点 1、快速的冷启动,不需要等待打包 2、

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

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

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

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

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

npm install vite

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

总结

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

--结束END--

本文标题: 如何用Vite构建工具快速创建Vue项目

本文链接: https://www.lsjlt.com/news/149143.html(转载时请注明来源链接)

有问题或投稿请发送至: 邮箱/279061341@qq.com    QQ/279061341

本篇文章演示代码以及资料文档资料下载

下载Word文档到电脑,方便收藏和打印~

下载Word文档
猜你喜欢
  • 如何用Vite构建工具快速创建Vue项目
    目录和Webpack相比,Vite具有以下特点Vite构建Vue项目构建过程可能会发生的一些问题总结和Webpack相比,Vite具有以下特点 1、快速的冷启动,不需要等待打包 2、...
    99+
    2022-11-13
  • 使用Vite+Vue3+Vant全家桶快速构建项目步骤详解
    目录引言一、vue3全家桶模板介绍1.版本依赖2.全家桶内置集成二、安装 tive-cli 命令行工具三、生成项目四、项目体验引言 随着Vue3 和 Vite 版本的不断更新完善,开...
    99+
    2022-11-13
  • vue-cli如何快速构建项目以及引入bootstrap、jq
    这篇文章主要介绍vue-cli如何快速构建项目以及引入bootstrap、jq,文中介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们一定要看完!vue-cli脚手架工具快速构建项目架构:。。首先默认了有...
    99+
    2022-10-19
  • 如何快速创建React项目并配置webpack
    本文小编为大家详细介绍“如何快速创建React项目并配置webpack”,内容详细,步骤清晰,细节处理妥当,希望这篇“如何快速创建React项目并配置webpack”文章能帮助大家解决疑惑,下面跟着小编的思路慢慢深入,一起来学习新知识吧。1...
    99+
    2023-06-26
  • Vue如何使用vue-cli创建项目
    这篇文章主要介绍了Vue如何使用vue-cli创建项目,具有一定借鉴价值,感兴趣的朋友可以参考下,希望大家阅读完这篇文章之后大有收获,下面让小编带着大家一起了解一下。具体如下:vue-cli 是一个官方发布...
    99+
    2022-10-19
  • 如何用Vue-cli来构建Vue项目
    这篇文章给大家介绍如何用Vue-cli来构建Vue项目,内容非常详细,感兴趣的小伙伴们可以参考借鉴,希望对大家能有所帮助。首先需要安装Vue-cli:npm install -g vue-cli全局先安装Vue...
    99+
    2023-06-22
  • FastApi如何快速构建一个web项目的实现
    目录项目介绍项目目录构成项目内容数据文件内容模板渲染同步接口异步接口项目入口文件项目依赖项目部署访问效果FastApi快速构建一个web项目 已经使用FastApi很久了。这个一个...
    99+
    2023-03-24
    FastApi构建web项目 FastApi构建web
  • Golang如何快速构建一个CLI小工具详解
    目录如何Golang快速构建一个CLI小工具先上效果那么如何实现呢?如何Golang快速构建一个CLI小工具 在现实开发的过程中,大家会发现很多开源的框架都会有着自己的一个CLI工具...
    99+
    2022-11-11
  • Java中如何快速构建项目脚手架的实现
    目录1 前言2 微服务项目准备3 脚手架构建3.1 项目正常启动 && 测试用例正常3.2 在项目的根pom中加入以下maven插件配置3.3 执行archetype...
    99+
    2022-11-13
  • 如何用VS code快速搭建一个Golang项目
    本篇内容主要讲解“如何用VS code快速搭建一个Golang项目”,感兴趣的朋友不妨来看看。本文介绍的方法操作简单快捷,实用性强。下面就让小编来带大家学习“如何用VS code快速搭建一个Golang项目”吧!安装go...
    99+
    2023-07-06
  • 如何用vue-cli创建项目并webpack打包
    本篇内容介绍了“如何用vue-cli创建项目并webpack打包”的有关知识,在实际案例的操作过程中,不少人都会遇到这样的困境,接下来就让小编带领大家学习一下如何处理这些情况吧!希望大家仔细阅读,能够学有所...
    99+
    2022-10-19
  • 如何使用vue-cli创建项目并webpack打包
    这篇文章主要介绍“如何使用vue-cli创建项目并webpack打包”的相关知识,小编通过实际案例向大家展示操作过程,操作方法简单快捷,实用性强,希望这篇“如何使用vue-cli创建项目并webpack打包...
    99+
    2022-10-19
  • 如何在SpringBoot中利用Spring Initializr 快速构建一个工程
    本篇文章给大家分享的是有关如何在SpringBoot中利用Spring Initializr 快速构建一个工程,小编觉得挺实用的,因此分享给大家学习,希望大家阅读完这篇文章后可以有所收获,话不多说,跟着小编一起来看看吧。一、Spring I...
    99+
    2023-05-31
    springboot initializr spring
  • go npm git 教程:如何运用这些工具来创建一个完美的项目?
    GO, NPM, GIT 教程:如何运用这些工具来创建一个完美的项目? 在现代软件开发中,Go、NPM 和 Git 是必不可少的工具。Go 是一种高效、现代化的编程语言,NPM 是 Node.js 的包管理器,而 Git 是一个广泛使用的版...
    99+
    2023-10-16
    npm git 教程
  • 如何使用Java快速创建和维护高效的索引数据结构?
    在现代软件开发中,数据结构是非常重要的一部分。一个好的数据结构可以使得程序在处理大量数据时更加高效,而索引数据结构则是其中的一种。在本文中,我们将会介绍如何使用Java快速创建和维护高效的索引数据结构。 一、什么是索引数据结构? 索引数据...
    99+
    2023-09-23
    索引 npm leetcode
  • 如何使用PyCaret快速轻松地构建机器学习项目并为部署准备最终模型
    这篇文章主要介绍“如何使用PyCaret快速轻松地构建机器学习项目并为部署准备最终模型”,在日常操作中,相信很多人在如何使用PyCaret快速轻松地构建机器学习项目并为部署准备最终模型问题上存在疑惑,小编查阅了各式资料,整理出简单好用的操作...
    99+
    2023-06-15
  • 项目实践:如何运用CSS框架快速搭建网页的经验总结
    项目实践:如何运用CSS框架快速搭建网页的经验总结在当今的互联网时代,网页已经成为我们日常生活和工作中不可或缺的一部分。而要快速、高效地搭建网页,CSS框架被广泛运用。本文将分享一些经验总结,帮助大家更好地运用CSS框架来快速搭建网页。一、...
    99+
    2023-11-02
    快速搭建 经验总结 CSS框架
软考高级职称资格查询
编程网,编程工程师的家园,是目前国内优秀的开源技术社区之一,形成了由开源软件库、代码分享、资讯、协作翻译、讨论区和博客等几大频道内容,为IT开发者提供了一个发现、使用、并交流开源技术的平台。
  • 官方手机版

  • 微信公众号

  • 商务合作