利用vite创建vue3项目

最新推荐文章于 2024-05-25 13:22:06 发布
最新推荐文章于 2024-05-25 13:22:06 发布
阅读量391 收藏 1
点赞数 10
分类专栏： vue3 文章标签： vue
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/lucky_ly/article/details/137060153
版权

vue3 项目推荐使用vue官方推荐的vite手脚架创建，vue3项目，使用vue-cli 会存在一些问题

1.node的版本

目前的vue3需要至少需要node18及以上，可以安装nvm node包管理器可以快速切换node版本，因为node的版本的兼容性真是一言难尽。
nvm有window的也有linux的
https://github.com/coreybutler/nvm-windows?tab=readme-ov-file

2.使用命令创建vue项目

npm create vue@latest

3安装包并启动项目

cd 项目名
npm install
npm run dev

在这里插入图片描述

在这里插入图片描述

https://cn.vuejs.org/guide/quick-start.html

forwardMyLife
关注
  • 10
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
vite构建vue3项目
BREATH_YOUSELF的博客
06-25 193
---------- 使用create-vue搭框架(可选router和pinia) ------------------------- 使用vite搭框架(没有router和pinia) -------------------------- 组件库element-plus ---------------------- 预处理器 Sass ---------------------- 配路由 ------------------------- 配代理 -------------
vite搭建vue3项目
09-06
2. **创建项目**：使用Vite创建一个新的Vue 3项目： ``` create-vite vite-vue3Demo2 ``` 这将创建一个名为`vite-vue3Demo2`的新目录，并初始化Vue 3项目。 3. **进入项目目录**： ``` cd vite-vue3Demo2 ``...
vite-vue3
Raywh的博客
06-06 2324
vite + vue3 使用文档(单页应用-超简单教程)，简化使用，但是更多的还是阅读文档
vue3.0+ts+vite+scss创建一个vue项目
最新发布
dengzihao1023的博客
05-25 355
使用Vite创建一个vue3项目。
vite 构建 vue3
weixin_42913264的博客
02-02 327
使用 vite 构建 vue3
vite 搭建vue3
li1552702425的博客
05-27 153
@ vite 搭建vue3 element plus项目 安装vite npm init @vitejs/app 使用vite搭建vue3 npm init @vitejs/app my-vue-app --template vue 安装element puls npm install element-plus --save vite.config.js 安装sass npm install -g sass 挂载到main.js中 import { createApp } from 'vue' i
使用 vite 搭建vue3项目
温小鹿的博客
07-16 236
安装vite cnpm i -g create-vite-app 使用vite创建项目 create-vite-app 项目名 运行指令就Ok了 cd project npm install (or `yarn`) npm run dev (or `yarn dev`)
vite+vue3动态模块化导入并使用pinia
03-25
在"vite+vue3动态模块化导入并使用pinia"的项目中，我们可以通过以下步骤实现动态模块化导入和使用Pinia： 1. **配置Vite**：在`vite.config.js`中，我们需要配置Vue3和Pinia的插件，如`@vitejs/plugin-vue`和`vite...
Vite+vue3+ts 项目初始化底座
02-21
接着，创建一个新的Vue 3项目，同时指定使用TypeScript： ``` create-vite my-vue3-ts-project --template vue cd my-vue3-ts-project ``` 这将生成一个基础的Vue 3 + TypeScript的项目结构。 **5. 配置Vite** 在`...
vite+vue+cesium项目搭建
03-13
1. **创建Vue模板**：首先，你需要通过npm或yarn创建一个基于Vue的Vite项目。对于npm 6.x，命令是`npm init vite@latest my-vue-app --template vue`；对于npm 7+，由于命令行语法变化，需要添加额外的双破折号，即`...
vite2 + vue3构建多页应用-源码demo
10-15
Vue3 提供了更加高效、模块化和可扩展的组件系统，而Vite2则是一款由Vue.js作者尤雨溪开发的新型构建工具，它利用了ES模块的原生加载能力，大大提升了开发时的性能。本项目“vite2 + vue3构建多页应用-源码demo”将...
vite-vue3-template:Vite + Vue3项目模板
03-18
vite-vue3-模板 Vue 3 +打字稿+ Vite项目模板
vue3和vite
s8806479的博客
05-15 970
客户端渲染效率比vue2提升了1.3~2倍SSR渲染效率比vue2提升了2~3倍。
使用vite搭建Vue3项目
weixin_64608867的博客
04-01 1106
一.安装： 1.卸载老版本vue-cli： yarn global remove vue-cli 2.卸载老版本vue： yarn global remove vue 3.安装vue最新版本： yarn global add vue@next 4.安装vue-cli最新版本： yarn global add @vue/cli@next 二.全局安装vite： yarn create vite-app 项目名称 以下几种方式都可以： npm init vite-ap.
vite 创建vue3 项目
qq_25194685的博客
05-17 257
# yarn yarn create @vitejs/app my-vue-app --template vue
vue3 + vite
WJLSH123的博客
04-26 7484
端口控制 + 跨域 在vite.config.js文件中 import { defineConfig } from 'vite' import vue from '@vitejs/plugin-vue' import path from 'path'; // https://vitejs.dev/config/ export default defineConfig({ plugins: [vue()], base: "./",//打包路径 resolve: { alias: {
vite创建vue3项目
专注
02-12 644
vite官网 在需要创建的文件夹执行以下指令 // npm 7+ npm init vite@latest my-vue-app -- --template vue 执行指令后，一直按确认，按默认安装即可。 创建的项目默认是vue3+typescript
idea 用vite创建vue项目
09-06
你可以按照以下步骤使用Vite来创建Vue项目： 1. 打开终端或命令提示符窗口。 2. 进入你想要创建项目的文件夹。如果你想在D盘创建一个名为vue_project的文件夹，可以使用以下命令： ``` d: cd D:\vue_project ``` 3. 运行以下命令来创建Vue项目： ``` npm init vite-app . ``` 这将使用Vite创建一个新的Vue项目。记得在命令的最后加上一个点，以表示当前文件夹为项目根目录。 4. 在创建项目时，你会被要求选择一个模板。选择Vue模板，并按照提示输入其他信息。 5. 创建完成后，进入项目文件夹： ``` cd your_project_name ``` 注意将"your_project_name"替换为你的项目名称。 6. 运行以下命令来安装项目依赖： ``` npm install ``` 7. 安装完成后，运行以下命令来启动开发服务器： ``` npm run dev ``` 这将启动Vite开发服务器，并在浏览器中打开项目。 8. 现在，你可以开始编写Vue项目了！ 希望这些步骤能帮助你使用Vite创建Vue项目。如果你想使用Yarn来创建项目，也可以按照类似的步骤来操作。例如，使用以下命令来创建项目： ``` yarn create vite-app your_project_name ``` 然后进入项目文件夹，运行以下命令来安装依赖并启动开发服务器： ``` cd your_project_name yarn yarn dev ```<span class="em">1</span><span class="em">2</span><span class="em">3</span> #### 引用[.reference_title] - *1* *2* *3* [利用Vite或者webpack创建Vue项目，并启动Vue项目](https://blog.csdn.net/weixin_45269353/article/details/126692829)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_1"}}] [.reference_item style="max-width: 100%"] [ .reference_list ]
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值