初学 vue 之使用 vue-cli4 创建项目

笔记一篇,备查。
刚刚接触vue-cli4,其实我都不知道1,2,3长什么样子。
哈哈,接下来开始我的vue菜鸟之旅。

菜鸟之旅第一步:选择模式
1.界面模式:打开终端,输入vue ui回车。弹出提示要调用google浏览器,选择是。如下图所示:
初学 vue 之使用 vue-cli4 创建项目
自动打开浏览器,跳转至vue可视化界面模式。如下图所示:
初学 vue 之使用 vue-cli4 创建项目
2.命令行模式
选择好项目文件放置的路径,打开终端输入vue create filename(ps:此处的filename为要创建的文件英文命名)
用上下方向键去选择配置,选择完成后回车。

第二步:新建一个项目
1.选择项目放置文件夹:可选择已有文件夹,也可选择新建
初学 vue 之使用 vue-cli4 创建项目
2.配置项目名称:填写项目名称后点击下一步。初学 vue 之使用 vue-cli4 创建项目
3.选择预设:(我是新手配置都选择默认)
4.安装Xcode:系统会自动跳转到安装Xcode,选择安装。
初学 vue 之使用 vue-cli4 创建项目
5.在编辑器打开项目:
这里踩了一个坑,点击在编辑中打开,终端显示无法打开编辑器。初学 vue 之使用 vue-cli4 创建项目
此处借鉴大神写的教程。
解决方案:编辑器无法打开解决方案

打开 VS Code–>命令面板 ,在命令框中输入 ‘shell command’ ,找到并点击: “Install ‘code’ command in PATH command”