本章主要内容有
- 安装vue-cli脚手架
- 用脚手架创建项目
- vscode安装常用插件
注:博主用的编辑器是vscode,所以插件什么的也适用于vscode,用其他编辑器的小伙伴,找一下度娘。
-
安装vue-cli脚手架
打开vscode,然后按 ctrl+shift+ ` 会出现如下界面(控制台)
然后在其中输入
npm install -g @vue/cli //用npm的运行该命令
# OR
yarn global add @vue/cli //用yarn的运行该命令
安装成功后运行
vue --version
将得到相应的版本号
注:在新建项目时必须先安装node,node有自带的npm,未安装的请点击这里进行下载安装
-
用脚手架创建项目
在用脚手架创建项目前必备工作有如下:- 建一个英文命名的文件夹作为开发文件存放空间
- 有仓库的,如GitHub,码云的关联下,没有的可以建一个。当然不建也没关系。只是一旦代码丢了就难找回来了。
在经过如上工作之后在控制台运行如下命令
vue create 你的项目名 //最好用英文
你将会得到如下界面
注: 新手最好选择默认,如果是对配置较为熟悉的同学可以选择自选或者自行配置。
选择后将自行创建项目,创建后目录如图所示:
注:博主的是逻辑使用js,喜欢ts的小伙伴,请找度娘或者点击这里
-
vscode安装常用插件
操作步骤如下图
因为博主在网上看到一篇比较好的插件讲解文章,所以博主就不对进行插件的叙述了,需要的可以看一下
作者是梁源大佬的使用Visual Studio Code编写Vue的札记 需要的自取。
本文参考:
vue-cli创建项目
注:如有侵权,请联系博主删除!