Vue2学习（五）：使用Vue脚手架创建项目

已于 2024-02-17 23:11:56 修改
阅读量363 收藏 1
点赞数
分类专栏： Vue学习 文章标签： vue.js 学习
于 2023-05-20 22:54:38 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_46175652/article/details/130781215
版权

Vue2学习（五）：使用Vue脚手架创建项目

1、查看脚手架版本

查看当前Vue脚手架的版本

在这里插入图片描述

执行过程中发现“vue不是内部或外部命令”，这时需要去配置下变量。

在这里插入图片描述

再次去执行命令，发现就可以了。

在这里插入图片描述

2、开始创建

以管理员身份运行命令指示符

在这里插入图片描述

进入到指定目录

在这里插入图片描述

执行命令进行创建

vue create 项目名

在这里插入图片描述

输入y，点击回车确认

在这里插入图片描述

点击回车确认

在这里插入图片描述

等待创建

在这里插入图片描述

创建完成

在这里插入图片描述

3、运行项目

进入项目

在这里插入图片描述

执行命令运行项目

npm run serve

在这里插入图片描述

在浏览器输入访问地址

在这里插入图片描述

阿标的博客
关注
专栏目录
使用vue-cli脚手架创建vue2项目
qq_51284317的博客
07-06 1212
使用vue-cli脚手架创建vue2项目
VUE-CLI4：使用VUE脚手架创建项目
算云烟
11-18 1134
一、概述 VUE-CLI是VUE官方推出的用来构建VUE项目的脚手架配置工具 基于vue.js，用于自动生成vue.js+webpack的项目模板 它有以下三个组件 CLI：@vue/cli 全局安装的 npm 包，提供了终端里的vue命令（如：vue create 、vue serve 、vue ui 等命令） CLI 服务：@vue/cli-service是一个开发环境依赖。构建于 webpack 和 webpack-dev-server 之上（提供 如：serve、build 和 inspect
Vue2使用脚手架创建项目
codefan※的博客
07-18 2583
先解释一下关于脚手架的概念        可以理解为像我们盖房子，需要打牢地基，也就是做一些前提准备工作，例如webpack的配置文件、node一些包的下载等等，形成项目的基本构架，这样就大大提高了项目的开发效率。试想一下，如果在你想要写一个项目的时候，需要你自己配置这些东西，心态先崩掉 前提准备——脚手架安装 可以使用编译器的终端或者cmd：npm install @vue/cli(@version) -g 建议安装cli3以上，不然
创建Vue2项目
最新发布
wxh_huayu的博客
08-10 568
创建vue2
Vue2 通过脚手架（cli）创建项目方式
weixin_45703831的博客
04-30 1158
【注意，创建的文件夹名字最好不要与项目名同名】
创建一个vue2的脚手架项目（超详细）
adminsir0的博客
10-10 6966
vue，vue2，脚手架，目录，npm，node，vue项目
Vue2脚手架创建项目
qq_39593914的博客
04-11 4492
Vue2脚手架创建项目 一、使用脚手架 1.安装 @vue/cli ​ 简述 cli ===> command line interface (命令行接口) // 安装 npm install -g @vue/cli # OR yarn global add @vue/cli // 升级 npm update -g @vue/cli # OR yarn global upgrade --latest @vue/cli // 版本查看 vue --
使用Vue脚手架创建Vue项目
m0_70955866的博客
11-04 443
5. 检查你是否安装vue/cli,只需要在命令行运行vue指令,如果不报错,则说明安装成功。Vue脚手架隐藏了所有的webpack相关的配置,若想查看具体的webpack配置,请执行。在弹出的选项中,选择你需要安装的配置项: 通过上下键进行切换,通过空格键进行是否选中。在弹出的选择中,表示是否是使用history方式创建路由:默认,选择y。参考:资料/vue.js环境搭建.docx。vue create 项目名。
基于脚手架创建Vue项目实现步骤详解
10-15
在想要创建项目的路径下，运行`vue create test`，其中`test`是你的项目名称。随后，CLI会询问你选择预设配置还是自定义配置。选择“default”则使用默认配置，包括Babel和ESLint；选择“Manually select features...
2024最新：关于基于vue-cli脚手架创建vue项目（图文版）
m0_69097184的博客
09-21 578
它确保各种构建工具与合理的默认值一起顺利运行，因此您可以专注于编写应用程序，而不是花费数天时间争论配置。同时，它仍然提供了调整每个工具配置的灵活性，而无需弹出。TypeScript 是一个 JavaScript 的超集，包含并扩展了 JavaScript 的语法，需要被编译输出为 JavaScript 在浏览器运行。代码风格检查和格式化（如：ESLint）【建议选择】vue-router（Vue 路由）【建议选择】。vuex（Vue 的状态管理模式）。E2E（端到端）测试。概述（来源于官方文档）
用脚手架新建一个vue2的项目
sinat_34896766的博客
01-05 1318
2、在项目新建路径的外层文件夹下打开cmd，输入vue create 项目名(需要安装node，node安装完成后，可用node -v查看安装版本。项目名不能包含大写母，否则会提示以下错误。注意此时的v是大写的V。
VUE-脚手架搭建
xhmico的博客
12-15 2991
vue 有两个大版本，分别是 vue-2 和 vue-3，目前新项目的话用 vue-3 的会比较多以下我会分别提供搭建 vue-2 和 vue-3 脚手架的过程。
vue2搭建脚手架（vue-cli）并创建一个项目
所行皆坦途
07-31 1569
学习使用 vue2脚手架（vue-cli） 创建vue项目，附详细代码、图片解析。
手动搭建vue2脚手架项目
m0_58188818的博客
04-06 761
手动搭建vue2脚手架项目
创建一个vue2项目--vue create
shuyaohuang的博客
12-26 695
通过vue create创建一个vue2项目
vue cli2脚手架创建项目
norang的博客
11-14 329
先来 看看 你有没有 装 vue脚手架 win+R 输入“cmd” 输入“npm config ls” 在prefix的路径中 存放着 npm全局安装的一些东西 安装过程可能会遇到 系统禁止运行脚本的报错 set-ExecutionPolicy RemoteSigned vue init webpack “自己的项目名称” 配合vue的笔记 ...
vue-cli 2.x搭建项目
小青柑的博客
05-17 230
创建一个vue项目: 1,全局安装vue命令行模块 vue-cli npm install vue-cli -g 注意:vue-cli 依赖于webpack,在使用vue-cli之前,先安装webpack npm install webpack -g 2,创建项目文件夹,并在这个文件夹下打开命令行 3,初始化一个vue项目 vue init webpack 注意: 其中Eslint 选项是代码格式校验工具, 要选择NO ,否则会以严格模式校验代码, 如: 注释//后必须有且只有一个空格, 否则
VUE 使用 vue create 命令 创建 vue2.0 项目
热门推荐
不想成为可以改变世界的程序员，不是一个好程序员
06-07 2万+
VUE 使用 vue create 命令 创建 vue2.0 项目 为了保证创建过程中避免出现因权限不足的原因 从而 导致创建失败的问题，我们使用 管理员身份 打开命令行 g:表示切换进入G盘 cd git表示打开 当前盘下的 git 文件夹 大家可以根据以上两个命令进入自己想要保存项目的目录下，我这里是保存在 G:\Git 文件夹.........
使用vue脚手架快速搭建vue 2项目
追梦的女孩博客
11-27 653
针对cli的项目，直接 npm run serve。1.安装node(js代码的运行环境)、npm；对于cli项目，入口文件为main.js。使用命令引入element-ui框架。2.全局安装vue-cli;等待项目创建成功即可。
手动配置webpack创建Vue项目：仿vue-cli脚手架
"本文将引导读者使用webpack搭建一个Vue项目，并实现类似vue-cli的脚手架功能。在过程中，我们将了解如何创建项目、配置webpack、引入依赖以及设置基本的项目结构。" 创建Vue项目的步骤： 1. 首先确保你已经安装了...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值