vue项目创建的两种方式

已于 2022-10-10 11:09:10 修改
阅读量644 收藏 1
点赞数 1
分类专栏： vue 文章标签： 前端 vue.js
于 2022-10-10 10:40:16 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/ftg1852vyf/article/details/127239880
版权

1. vite

npm init vue@latest

使用 npm init vue@latest 构建vue3项目,要注意Node.js 版本 14.18+，16+
不然npm run dev运行报错会error when starting dev server: Error: Cannot find module 'node:path'
在这里插入图片描述
这是因为vue3工程依赖的node版本比较高所导致的
vite文档原话：Vite 需要 Node.js 版本 14.18+，16+。然而，有些模板需要依赖更高的 Node 版本才能正常运行，当你的包管理器发出警告时，请注意升级你的 Node 版本。

2. vue-cli

vue create 【项目名】

需要先全局安装脚手架

npm install -g @vue/cli

//测试安装是否成功
vue -V
ftg1852vyf
关注
  • 1
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
专栏目录
vue create 和 vue init 区别
少健终望成，波中取千金----张少波
12-09 2370
一.vue cli2升级到vue cli3 1.先升级npm的版本 npm install -g npm 2.再卸载之前的vue cli 2.9.6 npm uninstall -g @vue/cli 3.下载最新的vue cli版本 npm install -g @vue/cli 二.vue3,0版本创建项目 1、vue create myproject 2、默认选择default方式即可 vu...
【问答系列】安装vue3的方式大总结，为何可以使用npm create vue@latest或npm init vite@latest充当vue脚手架安装vue项目
最新发布
商务合作 / 项目定制开发 / 前端一对一培训、答疑
06-19 1361
根据vue所述，建议安装nodejs的18.3及以上版本来开发vue3项目。但是实测nodejs 16+也可以。我在nodejs的16版本，运行如上命令后，不会报错，而是会提示你要安装：(y)当我输入y后，就会安装并执行create-vue，它是Vue官方的全新脚手架工具。但是假如我切换到nodejs的18版本，运行如上命令后，不会提示我安装命令，而是提示如下，表示可以安装项目了，npm create其实是npm init的一个别名：SeeUse。
使用vue create vue（基于webpack）创建的vue项目和使用npm init vue@latest（基于vite）的区别是什么？
gaoqiandr的博客
05-25 512
本文主要介绍的是基于webpack和基于vite配置创建的vue3项目之间的区别
npm create vite@latest 与 npm init vue@latest之间的区别
2301_76979068的博客
07-22 6694
如果你需要构建一个 Vue 项目，并且需要使用 Vue 生命周期、Vue Router、Vuex 等 Vue 生态的全套功能，以及一些预定义的配置和插件，可以选择使用 npm init vue@latest。 如果你希望创建的项目是一个现代化的、轻量级的项目，不依赖传统的打包工具如 webpack，而且希望享受到 Vite 的极速开发体验，可以选择使用 npm create vite@latest。
vue3 运行npm create vue@latest 和 npm init vue@latest 执行速度慢的问题
ljh574649119的专栏
02-07 1534
npm create vue@latest、和 npm init vue@latest 不管是电脑cmd上还是vscode终端上都是卡住不动！
【面试官】webpack和vite的区别
m0_61049675的博客
03-04 1162
Vite: Vite以开发模式下的极速构建著称。Webpack: Webpack的构建速度相对较慢，尤其在大型项目中，因为它需要分析整个依赖图，进行多次文件扫描和转译。Vite: 采用了基于ES Module的开发服务器，只有在需要时才会编译对应的模块，大幅度提升了开发环境的响应速度。Vite: 没有打包的步骤，它利用了浏览器的ES Module Imports特性，只有在真正需要时才编译文件。Vite: Vite也有相当数量的插件，但相对较小，因为它的开发模式和构建方式减少了对一些传统插件的需求。
创建vue工程项目的5种方式
weixin_47389477的博客
02-20 856
注意：首先需要npm i -g @vue/cli, vue-cli3.x的初始化方式，另外，如果创建的是vue2项目，脚手架vue-cli要使用3.x版本的。vue create 项目名(例:vue-project)会出现图像化界面（图二）
【Vue】构建vue项目的几种方法以及区别
qq_51307413的博客
09-08 2961
总的来说，npm init vue@latest和vue create用于创建基于 Vue.js 的项目，而npm init vite@latest用于创建基于 Vite 的项目。它们都是创建前端项目的命令，但使用的工具链和项目模板有所不同。npm init vue@latest和npm init vite@latest是通过 npm 包管理器直接安装 Vue.js，并创建一个基本的项目结构，而vue create是使用 Vue CLI 创建项目，并提供了更多的项目配置选项。
创建vue项目的几种方式
wang_xuan_1992的博客
12-02 329
注意：创建完成后，直接打包，访问是不能正确访问的，要在vue.config.js里配置一下publicPath。
创建Vue3的项目以及响应式基础
m0_72694993的博客
09-02 632
2.当我们创建完成，看脚手架的结构目录，我们会发现多一个vite.config.js这个文件，具有和webpack相同的功能，值得注意的是，vue3取消了对低版本浏览器即使用es6以下版本的浏览器的兼容，这样的目的使大幅度提高了性能，但是这里边并没有第三方依赖的资源包，所以我们通过npm install进行安装，这里注意的是，要在我们新建的项目作为当前目录的集成终端进行输入，否则会出现错误。选择完成我们就新建了一个基础的vue3框架了。1.vue2中通过给组件添加data数据属性来完成响应式系统的。
vue基础-创建vue项目的几种方式
smileKH的博客
07-04 534
vue基础，下面总结一下vue项目的第一步，创建项目的几种方式，希望对你有所帮助。这是Vue创建项目的几种方式，希望能帮助到你。
vue3 - 01.配置项目安装脚手架
qq_34111842的博客
10-16 893
/ https://github.com/coreybutler/nvm-windows/releases 进入网址，选择：nvm-setup.exe，下载并安装，需要注意的是，路径中不能有空格，中文。// 下载双击安装node：官网：https://nodejs.org/en/download/// win+R -> cmd -> 输入node-v / npm-v，出现版本号，说明安装成功。// 安装成功之后打开，在 拓展 搜索chinese汉化包，点击install安装，然后重启。
搭建 Vue3 项目
qq_38910592的博客
06-03 82
基于Vite构建工具的官方脚手架vue@latest@latestnpxcreate-vuevite。
创建一个Vue项目（含npm install卡住不动的解决）
qq_71654538的博客
02-03 1566
创建Vue、Node.js
Vue项目的搭建和启动
qq15035899256的博客
05-14 4360
本文是对Vue的学习，首先进行环境的准备(安装配置node.js)，再进行Vue项目的搭建和启动，最后介绍了Vue的项目结构和VSCode的使用。之后的学习内容将持续更新！！！
VUE环境搭建
不要造同样的轮子
11-13 275
最近在学习VUE，把搭建的详细步骤写在这里，避免后面同学采坑。
vue核心语法(超详细)
小罗的博客
03-09 6489
全称是Vue.js或者Vuejs。 基于标准HTML，CSS和JavaScript构建，并提供了一套声明式的、组件化的编程模型。
npm、vue、vue/cli的安装使用流程
hmwz0001的博客
08-22 212
八、npm run serve:启动vue服务，该服务是负责解析vue页面文件的(类似于iis或tomcat,当然有所不同)一-下载并安装node.js,官网：https://nodejs.org/zh-cn，双击运行安装。三、npm install npm@latest -g:安装最新版的npm。六、vue --version:显示vue/cli的版本号即安装成功。五、npm install -g @vue/cli:安装脚手架。四、npm install vue:安装vue.js。
使用vite创建vue3项目命令
m0_56168677的博客
03-05 2486
使用vite创建vue3项目命令
vscode怎么创建vue项目
01-20
在VSCode中创建Vue项目有两种方法： 方法一：使用vue-cli快速构建项目 1. 打开终端（Terminal）。 2. 在终端中执行以下命令安装vue-cli： ```shell npm install -g vue-cli ``` 3. 创建一个新的Vue项目，执行以下...

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

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

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值