安装vue3项目(vite和webpack两种方式)

最新推荐文章于 2024-04-30 23:43:24 发布
最新推荐文章于 2024-04-30 23:43:24 发布
阅读量1.6k 收藏
点赞数
分类专栏： vue纪要 vue 文章标签： webpack vue.js javascript
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_731335498/article/details/122038351
版权

方式一，使用webpack来创建项目

1.检查当前vue版本（ 检查当前vue版本，不高于4.5.请更新先卸载再更新最新版本）

vue -V

2.卸载vue及更新vue

npm uninstall vue-cli -g  //卸载
npm install -g @vue/cli  // 更新

在这里插入图片描述

3.借助脚手架创建vue3项目，创建完成后，根据自己的实际情况进行选择

vue create  项目名称

在这里插入图片描述
我用得yarn
在这里插入图片描述

4.启动项目

cd 项目名
yarn serve

方式二 ，使用心得vite创建vue3项目（暂不支持，因为新出不太确定是否存在问题，建议用wepack）

查看vite文档（https://www.uviewui.com/components/icon.html）

艾米家的猫儿（傻钢）
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
electron-vue-vite-webpack:Electron、vue3、vite2、webpack5、ant-design-vue2 整合
05-17
Electron + vue3 + vite2 + webpack5 + ant-design-vue2 如何和为什么 Vite是未来的脚手架 在开发期间使用“拜访”以保持快速启动的优势 使用“ webpack”解决包装期间的包装问题 命令 npm run dev npm运行构建 ...
vue2+iview+webpack 和vue3+vben+vite的技术对比的ppt
07-31
vue2+iview+webpack 和vue3+vben+vite的技术对比的ppt,用于解释为什么使用新技术和框架
vite 安装 vue3.0
江湖行骗老中医
07-17 2828
npmlink后，会把当前的包安装到全局\AppData\Roaming\npm下，同时也会生成bin中的指令，在\AppData\Roaming\npm当前包是以快捷方式的形式直接访问的，所以修改的时候，全局也会跟着修改。比较适合开发的时候。如果公司有条件搭建了属于公司自己的私库，我们可以学习create-vite-app的做法，创建以create-开头的包，并上传到私库，然后全局安装也好，npminit/npx也好，就可以像create-vite-app一样，直接调用bin中的指令执行。...
vue3安装
qq_40787608的博客
01-14 1606
vue3安装
vue3+vite+js 安装
最新发布
半梅芒果干的博客
04-30 673
首先需要node版本高于V16.14.1。
使用 Vite + Vue3 + Element-Plus + Pinia + Ts 搭建 Vue3 项目
sslcsq的博客
06-20 3857
最终，我们意识到 Pinia 已经实现了我们在 Vuex 5 中想要的大部分内容，并决定实现它 取而代之的是新的建议。与 Vuex 相比，Pinia 提供了一个更简单的 API，具有更少的规范，提供了 Composition-API 风格的 API，最重要的是，在与 TypeScript 一起使用时具有可靠的类型推断支持。与webpack搭建的是有些区别的，首先多了ts的配置文件，以及vite的配置文件vite.config.ts,还有vite呢拥有更好的打包编译性能。相当于组件中的 methods。
【vue3】webpack和vite介绍与使用【超详细】
我的开源项目:https://gitee.com/derekgo/vue-cms_xg
09-28 1928
webpack只负责项目打包，其他功能需要在webpack.config.js配置文件里进行设置。webpack适用于大型，复杂的项目，它可以处理多种不同类型的文件，并根据需求进行转换,压缩,打包。webpack唯一不好的就是配置比较复杂，需要花费一定的时间和精力进行学习和调试。
一篇文章说清 webpack、vite、vue-cli、create-vue 的区别
前端打工人的博客
05-10 3481
webpack、vite、vue-cli、create-vue 这些都是什么？看着有点晕，不要怕，我们一起来分辨一下。 先看这个表格： 脚手架 vue-cli create-vue 构建项目 vite 打包代码 webpack rollup 脚手架：创建项目，选择性安装需要的插件，指定统一的风格，生成demo。 构建项目：建立项目的运行环境，需要手动安装插件。 打包代码：代码写好之后，为了更好的使用，需要打包处理一下。 是不是有了一个整体的感觉？我们再来详细的看一下。 vue-
若依vue3,基于webpack(非vite版本)
01-02
Vite是尤雨溪在2020年推出的另一个构建工具，以其热重载和快速启动速度而受到关注，但它不是Webpack的替代品，而是对传统构建流程的一种革新。本项目选择使用Webpack，可能是因为Webpack的插件生态更加成熟，或者是...
vite-vue3-template:Vite + Vue3项目模板
03-18
Vite + Vue3 项目模板是现代前端开发中的一个高效构建工具，它结合了Vue 3框架的最新特性与Vite的快速开发优势。Vite是由Vue.js的作者尤雨溪开发的一款新型构建工具，旨在解决传统Webpack在开发阶段的性能瓶颈。Vue ...
vue3+vite+antd 后台管理系统基础模板
02-06
在Vue3项目中，通过适配器可以很好地与Vue3集成，提供一套美观、一致的设计风格和丰富的交互组件，如表格、按钮、输入框等，大大简化了前端开发的工作。 这个"vue3+vite+antd 后台管理系统基础模板"是一个用于快速...
在vue3的开发环境中为什么使用vite而不是用webpack
weixin_45821809的博客
08-03 2475
vue3使用vite的原理
vue3 更换构建工具 webpack 换成 vite
qq_38758763的博客
05-31 1408
vue3 webpack更换为vite
《Vue3+TS》Vite的初体验及和webpack的初比对
Oliver尹的博客
05-11 2454
Vite，发音 **/vit/，**可以说是今年大火的一个**前端构建工具**，其实在推出1.0版本的时候就可以初步的看出其功能的强大，只不过一直仅限于关注一下的状态，并未主动尝试去了解学习，随着尤大的近来的一再推荐，甚至直言用了vite就再也回不去webpack了之后就彻底点燃了我的兴趣，好吧，我也要学习一下（PS：卷不动了，卷不动了，大佬们不要动不动就彻底新干一个东西出来了，来不及学.....）
【vue3】使用vite构建vue3项目
热门推荐
嗨，朋友你好！我是前端领域的工作者
03-30 2万+
使用vite构建vue3项目、vite介绍、vite对比webpack
nginx vue2+webpack 和 vue3+vite 配置二级目录访问
qq_41231694的博客
09-25 2319
nginx vue2+webpack 和 vue3+vite 配置二级目录访问
Vue3打包构建从webpack改为vite
玛已的小空间
11-03 2849
记录Vue3项目将打包工具从webpack改为vite的修改内容
Webpack、Vite在Vue项目中常用的用法
qq_41111677的博客
03-07 633
总之，Webpack在Vue项目中扮演了至关重要的角色，它帮助开发者高效地管理项目的模块和资源，优化代码性能，并提供了一个灵活的配置系统来适应不同的项目需求。在Vue项目中，Webpack是一个核心工具，用于处理项目的模块打包、资源优化以及开发服务器的配置等任务。这些只是Vite在Vue 3项目中常用的一些用法示例。实际上，Vite还提供了更多高级功能和配置选项，你可以根据项目的具体需求进行进一步的探索和定制。Vite在Vue 3项目中是一个快速且高效的构建工具，它提供了许多实用的功能和用法。
聊聊我是怎么样用vite替换webpack的
qq_26314225的博客
06-24 4196
随着项目功能越来越多，代码越来越复杂，随之而来的就是项目的各种慢（ps:跑个项目的时间都能去茶水间打杯水回来喝一会儿了 😭😭😭）
vite和什么webpack什么的是构建vue项目不同吗？
06-13
是的，Vite 和 Webpack 是两种不同的构建工具，它们针对 Vue 项目的构建和开发有着不同的方法和特点。 Webpack 是一个功能强大的静态模块打包工具，它可以将项目中的 JS、CSS、图片等文件打包成一个或多个静态资源文件，使得网页加载更快、效率更高。Webpack 的配置和使用相对复杂，需要开发者对其原理和配置有一定的了解。 Vite 是一个基于 ES Modules 的构建工具，它使用浏览器原生的 ES Modules 特性，能够更快地进行开发和构建，支持热更新功能。Vite 的配置相对简单，开发者可以快速上手使用。 在 Vue 3 中，由于其使用了 ES Modules 和 Composition API，Vite 的构建速度比 Webpack 更快，而且支持更好的 TypeScript 支持。但是，对于一些复杂的项目，Webpack 仍然是一个可靠的选择，因为它更加灵活和定制化。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值