vue项目搭建

最新推荐文章于 2025-12-08 11:36:54 发布
原创 最新推荐文章于 2025-12-08 11:36:54 发布 · 269 阅读 · 0 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
文章标签：

#vue.js #前端 #javascript

本文记录了如何使用vueui和vuecreate进行Vue项目的可视化与命令行搭建。通过vueui，开发者可以在图形界面中选择所需功能。而vuecreate则允许自定义预设或手动选择项目依赖。无论是对于初学者还是有经验的开发者，这都是快速启动Vue项目的好方法。

搭建过多次vue项目，但是因为项目周期长，往往在下一次搭建的时候就忘记了，需要重新搜索尝试。给我自己的体验很不好，为了避免类似情况再发生，还是决定要记录一下。写的不好也希望各位看官能补充一下啦

vue可视化搭建项目

在需要创建的项目目录下打开cmd，输入vue ui 即可进入可视化vue项目搭建页面。
在这里插入图片描述
需要添加的功能自行选择
在这里插入图片描述

vue命令行搭建

在需要创建的项目目录下打开cmd，输入vue create进入项目初始化选择。

  1. 之前有设置预设模板就可以使用预设模板
  2. 没有预设模板选择Manually select features进行项目选择。

依赖选择什么的就不详细赘述了，根据自己的项目需要选择，应该是可以看懂的哈。

绝美焦栖
关注
VUE项目构建【vscode安装+node.js安装+vue ui可视化创建+命令行方式创建】（超详细图文教学）
zmsup.com
01-02 2818
VUE项目构建 1. 了解vue 用vue官方的语言便是：Vue (读音 /vjuː/，类似于 view) 是一套用于构建用户界面的渐进式框架。与其它大型框架不同的是，Vue 被设计为可以自底向上逐层应用。Vue 的核心库只关注视图层，不仅易于上手，还便于与第三方库或既有项目整合。另一方面，当与现代化的工具链以及各种支持类库结合使用时，Vue 也完全能够为复杂的单页应用提供驱动。 2. 准备工作 开发工具 我用的开发工具是VScode，是微软2015年推出的一个轻量但功能强大的源代码编辑器，基于 Ele
vue如何新建一个项目
freeherotoday的博客
10-17 187
vue 创建项目（npm安装→初始化项目） cli2 和 >cli2脚手架创建 第一步npm安装 首先：先从nodejs.org中下载nodejs 图1 双击安装，在安装界面一直Next 图2 图3 图4 直到Finish完成安装。 打开控制命令行程序（CMD）,检查是否正常 图5 使用淘宝NPM 镜像 大家都知道国内直接使用npm 的官方镜像是非常慢的，这里推荐使用淘宝 NPM 镜像。 $ npm install -g cnpm --registry=https://registry.np
vue项目搭建（比较详细）
羽风的博客
10-31 7270
上一篇内容：VUE从零开始环境搭建（https://blog.csdn.net/freegxx001/article/details/109373587） 在这之前我已经安装了git，在桌面或文件夹右键会有git base的选项（类似cmd的命令行） 创建项目 vue init webpack "xfly-admin" 这里每一步需要回车或者输入Y或N之后回车（注意y表示yes，n表示no） ？ Project name (my-project ) 敲y, 回车既可 ...
vue: vue项目搭建
qq_36413371的博客
07-30 139
环境 ： node.js – vue-cli -g – vue init webpack demo(‘项目名’) 或 vue ui 2.配置webpack
如何创建一个vue项目（详细步骤）
m0_67403076的博客
06-22 5万+
推荐下载地址：https://nodejs.org/en/推荐下载地址：https://cn.vuejs.org/ （1）以管理员身份打开命令行界面，进入任意一个想要创建项目的文件夹，输入vue create test_vue（2）做一些配置：（3）按方向键选中该项，然后按回车键：（4）按空格键按照如下进行配置：（5）选择vue版本，我选的是3.x（6）是否要保存为这个项目作为一个模板保存？（7）出现以下界面，项目创建成功：（1）跳转到以下界面，默认为8080端口，我的8080端口被占用，所以启动了8081
vue项目搭建以及全家桶的使用详细教程(小结)
10-17
为了帮助开发者更加高效地进行Vue项目搭建和使用Vue全家桶，本文将详细介绍整个过程，包括Vue官方脚手架vue-cli的使用、项目结构解析、UI框架的引入等核心知识点。 ### Vue项目搭建 首先，对于Vue项目的搭建，推荐...
Vue项目搭建 .xmind
06-28
Vue项目搭建 .xmind
elementUI+vue项目搭建
12-10
"Element UI + Vue 项目搭建"就是一种常见的前端开发方案，它结合了Vue.js这一轻量级、高性能的JavaScript框架和Element UI这一基于Vue的组件库，旨在为开发者提供一套完整的UI解决方案。在这个项目搭建过程中，我们...
requirejs + vue 项目搭建详解
10-19
在项目搭建之前，作者提到了对avalon框架的使用和升级中的问题，以及为什么会转向Vue框架。avalon框架由于升级加入了虚拟DOM后出现了一些不稳定因素，作者开始考虑其他MVVM框架。Vue由于其全面的文档支持、良好的...
Vue使用vue-cli创建项目
01-19
本文介绍了Vue使用vue-cli创建项目，分享给大家，具体如下： vue-cli 是一个官方发布vueJS项目脚手架：https://github.com/vuejs/vue-cli 我创建的模板项目：https://github.com/Aleczhang1992/my-vue-project/tree/dev 一、步骤 1.要求已安装Node.js (>=4.x, 6.x preferred) and Git. 可以设置cnpm可以提升依赖包下载速度： npm install -g cnpm --registry=https://registry.npm.taobao.or
vue 如何新建一个项目
ygy211715的博客
02-27 6万+
身为入行未深的小白前端，不断的学习是我们不可丢失的习惯。前端流行的框架也是层出不穷，vue在众多框架中脱颖而出。今天花了两个小时的时间自己走了一边创建vue项目的流程，跟你们分享。1：打开cmd命令行，首先安装node步骤：https://nodejs.org/en/download/      node官网，选择跟自己的电脑匹配的版本进行下载，然后一步步的安装即可，输入node -v，如果出现版...
Vue 项目搭建流程和使用大全
岁月如歌去，十年弹指间
07-21 4万+
Vue 项目搭建流程及项目中遇到的问题 项目搭建流程 1.使用vue cli 搭建项目框架 cnpm install -g vue-cli 安装vue cli 脚手架 vue init webpack projectName 创建项目 cd projectName cnpm install 安装依赖模块 2.使用 vue router cnpm install vue rou...
如何搭建一个vue项目
weixin_30500663的博客
05-02 1019
一、安装node环境 　　1、下载地址为：https://nodejs.org/en/ 　　2、检查是否安装成功：如果输出版本号，说明我们安装node环境成功 　　 　　3、为了提高我们的效率，可以使用淘宝的镜像：http://npm.taobao.org/ 　　输入：npm install -g cnpm –registry=https://registry.npm.taobao.or...
1.项目初始化使用 Vue CLI 创建项目
kiwi123111的博客
10-13 1049
使用 Vue CLI 创建项目 注意：不要使用 Git Bash 执行项目创建操作，使用 cmd 或者 powershell 之类的工具。 安装 VueCLI 检查是否安装VueCLI vue --version或vue -V 如果你还没有安装 VueCLI，或者版本低于 4，请执行下面的命令安装或是升级： npm install --global @vue/cli 创建项目 在你想创建文件的位置处，在命令行中输入以下命令创建 Vue 项目 vue create vue-app 注：1.vue-
vue项目环境搭建及一个简单的vue例子
热门推荐
Dancy的博客......
03-22 12万+
大家好，今天下午对于vue项目环境的搭建进行了研究，一直以来，我都是用cdn的方式将vue.js引入Html界面，然后就开始刷vue的官方文档了。在刷过文档之后，我就想着，真实的项目是怎么样子的呢，然后就开始了vue-cli脚手架的搭建和使用，下面是我搭建环境的步骤以及我自己初步使用vue-router实现的一个简单的不能再简单的例子。注意，文中的例子适合对vue已经有一定的了解，对vue组件化概...
windows 的Vue安装及使用
weixin_44460248的博客
01-22 529
1.首先必须要安装nodejs 2.输入命令安装VUE npm install --global vue-cli 3.创建一个文件夹来装vue项目，在该项目路径下输入指令（复杂安装）： E:\vuexiangmu>vue init webpack vue-demo01 3.创建一个文件夹来装vue项目，在该项目路径下输入指令（简单安装）: E:\vuexiangmu> vue...
计算机毕业设计|基于springboot + vue在线考试管理系统(源码+数据库+文档)
12-07 822
本文介绍了一个基于SpringBoot+Vue的在线考试管理系统。系统采用前后端分离架构，后端使用SpringBoot框架简化开发流程，前端采用Vue.js实现响应式界面，数据库选用MySQL存储数据。文章详细说明了系统设计原则、技术选型理由，并提供了功能演示视频、代码示例和测试用例。此外，还包含毕业设计选题推荐和源码获取方式。该系统具有用户友好的界面设计、完善的安全机制和良好的扩展性，适合作为计算机相关专业的毕业设计项目参考。
vue Hooks
最新发布
W_LIN的博客
12-08 225
‌。
Vue项目搭建
05-27
好的，下面是搭建Vue项目的步骤： 1. 安装Node.js和npm 首先需要安装Node.js和npm，Node.js是一种基于Chrome V8引擎的JavaScript运行环境，npm是Node.js的包管理器，用于下载和管理项目依赖。 2. 安装Vue CLI Vue CLI是Vue.js官方提供的脚手架工具，用于快速搭建Vue.js项目。 安装命令如下： ``` npm install -g @vue/cli ``` 3. 创建项目 使用Vue CLI创建一个新的Vue项目，在命令行中输入以下命令： ``` vue create <project-name> ``` 其中，`<project-name>`为你的项目名称。 创建完毕后，进入到项目目录中： ``` cd <project-name> ``` 4. 运行项目 在命令行中输入以下命令运行项目： ``` npm run serve ``` 该命令会启动一个开发服务器，并且自动打开浏览器，在浏览器中访问`http://localhost:8080`即可看到项目运行效果。 至此，Vue项目搭建完成。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值