使用Vite创建项目

最新推荐文章于 2024-07-22 13:40:38 发布
最新推荐文章于 2024-07-22 13:40:38 发布
阅读量139 收藏
点赞数
文章标签： 编辑器 vscode ide javascript 前端
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_60754128/article/details/130492469
版权

在确保本地有node的情况下，进行以下操作，如果没有，请先安装node。
首先新建一个文件夹
在这里插入图片描述
然后使用vscode打开这个文件夹，打开后打开终端，输入以下代码

npm create vite@latest

在这里插入图片描述
选择使用的技术栈
在这里插入图片描述
就创建好了
在这里插入图片描述
之后进入到该项目，输入以下代码安装一下相应的依赖

npm install

最后输入

npm run dev

运行
在这里插入图片描述
在这里插入图片描述
成功

I will.874
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
vue3+vite创建项目-（傻瓜式教程）
01-19
本教程将指导你如何使用Vue3和Vite创建一个新的项目，让你轻松入门Vue3的世界。 1. 安装Vite 首先，确保你已经安装了Node.js和npm。在命令行中运行以下命令全局安装Vite： ```bash npm install -g create-vite ```...
Vite创建的项目使用elementplus框架
11-17
【Vite创建的Vue项目】 在Vite环境中创建Vue项目，首先需要全局安装Vite，然后使用`vite create project-name`命令初始化项目。创建完成后，项目目录结构大致如下： - `README.md`：项目的基本介绍和使用指南。 - ...
使用vite搭建前端项目
shi450561200的博客
10-23 414
3、如需要在项目中使用库，可在项目中执行使用npm install 命令执行安装，例如引入less库。2、执行npm run dev 命令直接运行创建好的项目，在浏览器打开链接地址，可观看前端效果。提示如需安装其他依赖执行npm install ....,否则忽略(第三步再讲)。4、使用vite打包命令,这里只是简单讲述打包，域名配置代理，那一部分跳过不讲。执行打包命令后，可以用看到，多一个dist目录。dist目录下为打包结果。
创建空的vue项目，完整详细步骤
xi_aot的博客
12-12 1356
针对初学者友好的项目创建流程，希望对大家有所帮助
npm create vite@latest 失败
weixin_42265534的博客
08-13 5259
下载安装失败，提示：Node.js is only supported on Windows 8.1, Windows Server 2012 R2, or higher..trim().replace(/\/+$/g, '')因为安装的node版本过高，和当前操作系统不匹配。重新下载v13.14的版本安装，安装后再次执行npm create vite@latest。说明问题是node和npm的版本问题，node版本过低，需要升级。安装前删除所有npm缓存，即删除npm和npm-cache文件。......
记录一次很坑的创建Vite失败
na596的博客
03-22 3190
最后再次卸载重新安装了 npm install create-vite -g ，执行 npm create vite@latest shop-admin，还是报同样的错，卒。npm config set cache C:\Users\*新的用户名*\AppData\Roaming\npm-cache。还有一些别的原因，方法都试了，报错仍然是上面的'create-vite' 不是内部或外部命令。先是提示需要安装create-vite，安装重新执行上面命令，依旧报错。执行，依旧报错，卒。
创建基于 Vite 的新项目
wangyining070205的博客
10-02 2662
前些日子学习安装了Vue- CLI，现在官方推荐使用 create-vue 来创建基于 Vite 的新项目。试着安装了一下，感觉更简单了。
vite搭建vue3项目
09-06
2. **创建项目**：使用Vite创建一个新的Vue 3项目： ``` create-vite vite-vue3Demo2 ``` 这将创建一个名为`vite-vue3Demo2`的新目录，并初始化Vue 3项目。 3. **进入项目目录**： ``` cd vite-vue3Demo2 ``...
创建一个完整vite前端项目
07-21
这是一个基于vite包含了vuex，router，element-plus ，element-cons，axios，qs等全项前端功能项目模板，可以直接使用这个快速构建一个前端vite的项目。
通过命令行创建vue项目的方法
08-29
Vue CLI是官方提供的一个快速搭建Vue项目脚手架的工具，可以自动化创建项目结构和配置。 1. **安装Vue CLI**： 在命令行中，使用npm全局安装Vue CLI： ``` npm install -g @vue/cli ``` 如果在中国地区，由于...
解决安装 Vite 遇到的问题
热门推荐
怎奈你何的博客
08-23 1万+
vue3 vite npm
关于create-vite@latest is not recognized as an internal or external command的报错
jax的专栏
12-05 1589
关于create-vite@latest is not recognized as an internal or external command的报错
npm init vue@latest 创建项目启动报错记录
Kratial的博客
04-06 1642
1.在终端中输入sudo vim /etc/hosts 回车然后输入密码。2.若出现如下图所示（若没有则直接输入i,然后进行后续操作)，请输入E。然后输入i，移动到最后一行输入127.0.0.1 localhost。3.按esc退出编辑，然后输入:wq保存并推出。4.然后重启项目就可以了。
常用的npm包介绍和坑
web_ding的博客
01-19 309
node-sass： 介绍：Node-sass是一个库，.scss文件本地编译为css，并通过连接中间件自动编译。 坑：有时候下载第三方组件库，要重启项目才能正常使用 比如：Module build failed: Error: ENOENT: no such file or directory 方法一：npm rebuild node-sass 方法二：重启项目 -----------------------------------------------------------------.
npm init vite-app ＜project-name＞ 报错 Install for [‘create-vite-app@latest‘] failed with code 1
qiansitong的博客
09-03 3655
解决办法： 管理员身份运行cmd npm config set cache C:\Users*你的用户名*\AppData\Roaming\npm-cache npm config set prefix C:\Users*你的用户名*\AppData\Roaming\npm 注意：上面你的用户名改为自己电脑设置的用户名
RHCSA —— 第八节 （编辑器、编辑命令等）
weixin_51562484的博客
07-20 903
RHCSA —— 第八节 （编辑器、文本命令）
VScode连接虚拟机运行Python文件的方法
最新发布
Lzcsfg的博客
07-22 423
在扩展中搜索Remote-SSH首先输入格式为root@192.168.226.27 回车后选择配置。
Windows右键新建Markdown文件类型配置 | Typora | VSCode
神马都会亿点点的毛毛张
07-19 819
📌在前面毛毛张分享过Typora的安装教程以及使用Typora编辑Markdown文件的语法教程，具体可以参见下面两个教程万字长文详解Typora＋Github/Gitee+PicGo图床工具配置教程 | 保姆级教程万字长文详解Typora使用技巧总结 | CSDN文本编辑器语法 | Typora记事本记笔记 | 写CSDN博客 | 使用技巧总结 | Markdown语法今天分享的关于Typora这个软件的第3️⃣期，我们首先来看一下问题背景👇。
Vscode离线下载对应版本的ms-python.vsix
城城城的blog
07-20 369
vscode，ms-python，离线下载特定版本的python
vue使用vite创建项目
10-25
如果是第一次使用 Vite 创建项目，会提示安装 create-vue 脚手架。需要输入 y 然后按回车键确认安装。在 VSCode 中打开项目，随便选择一个文件，按 ctrl + 反引号 打开终端，然后在终端中输入 npm run dev 运行当前...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值