创建Vue项目以及导入VScode开发工具并试运行
一、前言1、本例环境node.js:v12.14.1npm:v6.13.4vue:@vue/cli 4.2.32、node.js环境安装与测试由于vue的安装与创建依赖node.js(JavaScript的运行环境)里的npm(包管理和分发工具),因此需要先确保安装node.js。检测方式:打开cmd命令窗口(Window + R,输入cmd然后回车),输入 node -v 回车,正常显示node
一、前言
1、本例环境
node.js:v12.14.1
npm:v6.13.4
vue:@vue/cli 4.2.3
2、node.js环境安装与测试
由于vue的安装与创建依赖node.js(JavaScript的运行环境)里的npm(包管理和分发工具),因此需要先确保安装node.js。
检测方式:打开cmd命令窗口(Window + R,输入cmd然后回车),输入 node -v 回车,正常显示node.js版本代表已安装。
因为npm会随着node.js一起安装,所以,只要是node.js正常安装,就代表npm已经安装。
检测方式:cmd命令窗口输入 npm -v 回车,能正常显示npm版本。
没有安装的也不用担心,下载node.js安装包,然后一直“下一步”点下去就可以安装。
下载地址:https://nodejs.org/zh-cn/
二、安装vue脚手架:Vue CLI
官网:https://cli.vuejs.org/zh/
按照官方文档说明,安装命令为“npm install -g @vue/cli”。然而,原生npm的下载速度,大家都懂的...
因此,我们使用淘宝镜像来安装,命令:npm install -g @vue/cli --registry=https://registry.npm.taobao.org
等个三分钟左右,安装完成。cmd命令窗口输入 vue -V(V大写) 回车,能正常显示@vue/cli版本。
三、创建vue项目
首先我们计划在D盘vueTest文件夹下创建项目,命令窗口输入 d: 回车,再输入 mkdir vueTest 回车创建 vueTest 文件夹,再输入 cd vueTest 回车进入 vueTest 文件夹下。
1、vue create(一定要选中文件夹)
1.1.1、cmd命令窗口输入 vue create vueinit001 回车
default (bable,eslint) // 默认
Manually select features // 手动 **选择手动创建项目
1.1.2、如果不需要太多功能的话可以选择快速创建。选择第一个直接回车,进行项目创建
1.1.3、cmd窗口输入命令 cd vueinit001 回车进入 vueinit001 项目中,再输入 npm run serve 回车启动服务(一定要选中创建的项目名才能运行)
1.1.4、浏览器地址栏输入 http://localhost:8080/ ,正常打开网页表示项目创建成功
1.2.1、cmd命令窗口输入 vue create vueinit002 回车
更多推荐
所有评论(0)