创建vue工程项目的5种方式

已于 2024-02-29 10:44:33 修改
阅读量813 收藏 7
点赞数 1
文章标签： vue.js 前端 javascript
于 2024-02-20 10:41:44 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_47389477/article/details/136183755
版权

第一种

npm init vue@latest （生成vite构建项目）
终端界面的配置
在这里插入图片描述

第二种(和第一种相同，创建的项目结构也相同)

npm create vue@latest （生成vite构建项目）

第三种

npm create vite@latest
vite界面

vue3+js+vite 项目

在这里插入图片描述

第四种

vue create 项目名(例:vue-project)
在这里插入图片描述
vue3+js+vue-cli(webpack内置了)
在这里插入图片描述
首先需要npm i -g @vue/cli, vue-cli3.x的初始化方式，另外，如果创建的是vue2项目，脚手架vue-cli要使用3.x版本的

第五种

vue ui
会出现图像化界面（图二）
在这里插入图片描述

在这里插入图片描述

weixin_47389477
关注
  • 1
    点赞
  • 踩
  • 7
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
Vue3快速上手（一）使用vite创建项目
一掬净土
02-05 1204
Vue3快速上手（一）使用vite创建项目，需要安装node.js,我这边v18.19.0。
怎样创建一个VUE项目（超简单）
热门推荐
m0_70619994的博客
09-25 7万+
一、安装node.js 二、搭建vue环境 1、全局安装@vue/cli模块包 2、执行命令 3、检查是否安装成功 三、创建vue项目 1、创建项目 2、选择模板和包管理器，等待项目创建完毕 四、启动vue项目 1、执行命令 2、浏览项目页面 五、vue项目目录文件含义和作用 六、修改端口号 七、清理欢迎界面 补充：解决App.vue 代码是黑白色的方法
当用npm下载一个新的vue3项目，出现报错提示原因以及解决方法？
最新发布
fury的博客
05-10 691
npm create vue@latest 就可以创建项目了，这时候将之前的过期的镜像地址改为了最新的npmmirror.com地址。gpt提示是registry出现了问题，这时候已经想起之前看过的一个文章讲了，npm registry的问题，这时候我可以选择执行，将指向淘宝的镜像指向npmjs官网，但是这时候我选择查看之前看过的文章，当时希望下载一个新的vue3项目，
如何搭建一个vue项目(完整步骤)
qq_39093474的博客
09-11 1万+
这里如果选择保存的话，就要输入名字，默认就是文件夹的名字，下次配置的时候就会显示这个文件配置的选项就像上面的一样，在配置的时候会多出来一个。）下载hbuildx安装文件（已提供，无需下载），下载后，直接解压就可以使用。代码检查，选标准的就行，方向键切换，空格键选择然后回车。按空格键选择要安装的配置资源，带 * 号说明被选上了。上下方向键选择版本，这里我们选择vue2，然后回车。代码检查时间，方向键切换，空格键选择然后回车。启动成功之后，打开路径看到如下界面说明成功。通过上下方向键选择对应配置，然后回车。
vue 创建新项目
weixin_44161385的博客
02-11 3万+
vue创建新项目的几种方式
如何创建vue项目，创建的方式？
weixin_73184582的博客
04-19 4643
以上就是使用 Vite 工具创建 Vue 项目的方法，Vite 是一个基于 ES Module 的开发工具，可以帮助开发者快速搭建 Vue 项目，并提供了快速热重载、按需加载等功能，可以大大提升开发体验。以上就是使用 Webpack 创建 Vue 项目的方法，虽然需要手动配置比较复杂，但是可以根据需求进行高度的自定义和扩展，是比较灵活和强大的构建工具。首先需要安装 Node.js 和 npm 包管理器，Node.js 官网提供了对应的安装包和指南，可以根据自己的操作系统和版本选择下载和安装。
【Vue】构建vue项目的几种方法以及区别
qq_51307413的博客
09-08 2848
总的来说，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使用vue-cli快速创建工程
01-19
本文介绍了vue使用vue-cli快速创建工程，分享给大家，具体如下： vue-cli安装 npm i vue-cli -g vue init webpack-simple vue-todos vue-cli 是一个官方发布 vue.js 项目脚手架，使用 vue-cli 可以快速创建 vue ...
安装Vue脚手架， 用脚手架创建vue工程项目
06-13
安装Vue脚手架， 用脚手架创建vue工程项目
vue下载及创建vue工程
11-30
Vue 下载及创建 Vue 工程 Vue 是一个流行的前端框架，由 Evan You 于 2014 年创建，旨在简化 Web 应用程序的开发过程。以下是关于 Vue 下载及创建 Vue 工程的知识点： 安装 Node.js Node.js 是一个 JavaScript ...
vue工程，新建的项目工程
03-23
"vue工程，新建的项目工程" 指的是使用Vue.js进行新项目的初始化工作。在这个过程中，我们需要了解Vue CLI（命令行工具），它是Vue生态系统的一部分，用于快速搭建基于Vue的应用。 Vue CLI提供了丰富的预设模板，...
vue基础-创建vue项目的几种方式
smileKH的博客
07-04 531
vue基础，下面总结一下vue项目的第一步，创建项目的几种方式，希望对你有所帮助。这是Vue创建项目的几种方式，希望能帮助到你。
npm创建vue项目
qq_41425194的博客
07-01 5496
可通过官网下载：https://nodejs.org/en/创建一个自己的文件夹，在文件夹所创建的位置下，搜索cmd打开终端命令行输入命令：npm install -g @vue/cli1.输入命令 vue create demo01（vue create + 文件名）正在上传…重新上传取消 2.创建途中选择第一个即可3.在编译软件中通过cmd打开项目，系统命令行运行npm输入命令 npm run server...
vue项目搭建【详细入门创建】
qq_63656102的博客
07-09 3455
vue在前端开发中是不可缺少的一种框架，在国内运用非常广泛，所以学习这门框架是前端的必备技能，所以在入门中，我们要学会如何搭建一个vue项目，不管是vue2还是vue3他们的创建方法都是差不多的。第一种是最简单的，那就是直接引入cnd，当然这种方法是不可取的，在这里就不说了，主要的还是用脚手架来创建vue项目，目前的脚手架有。创建完成后，在cmd命令行输入 vue create 项目名称 来创建，回车即可。当然，命令运行都是可以改的，所以大家记住默认的运行即可。所创建的目录文件如下就说明创建完成了。
【Vue】从零开始创建一个Vue项目(详细步骤)
naihe_fish的博客
07-25 7980
安装过程不多赘述，安装完成后使用命令查看，如果输出版本号，说明我们安装node环境成功。
Vue工程化项目01-通过cli创建vue项目
aiains的博客
10-17 363
用vue控制自定义属性的值，然后在子组件中利用props接收数据，然后将数据进行展示。
前端工程（一）：创建一个Vue项目工程
兮和的个人博客
03-25 550
创建一个Vue工程
快速创建vue项目的三种方式
m0_56983341的博客
07-04 1845
快速创建vue项目
npm create vue
07-27
根据引用\[1\]中提供的信息，创建一个Vue项目的命令是npm create vue。这个命令会提示你输入一些项目的配置信息，比如项目名称、项目描述、作者等。你可以根据自己的需求进行配置。在配置完成后，npm会自动为你安装所需的依赖包。 #### 引用[.reference_title] - *1* [使用npm创建vue项目（超详细）](https://blog.csdn.net/M1234uy/article/details/107532777)[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^v91^insert_down1,239^v3^insert_chatgpt"}} ] [.reference_item] [ .reference_list ]

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

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

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值