image.png

创建之前需要Node.js的加持,前往https://nodejs.org下载。

安装完node之后,在命令行窗口输入node -v查看版本信息。如显示版本信息即安装成功!

image.png

node自带npm包管理工具,使用npm来安装创建vue项目。

这里使用vsCode来创建。

创建项目

1.打开vscode选择或创建一个新的空文件夹。

2.在顶部导航找到终端选项卡,点击新建终端

image.png

3.使用npm命令下载vue脚手架包全局安装到本地。在终端输入以下命令。

npm i @vue/cli -S
//-S 为记录到package.json中,方便重构下载

image.png

4.下载完成后命令行输入vue -v弹出帮助指令即为成功安装。

image.png

5.在你选择或者创建的目录下,在终端输入vue create webapp进入创建选项。

image.png

6.终端显示你要创建vue2还是vue3的项目,按键盘上下键选择,按下回车键确认。

image.png

7.看到如下图所示说明你的vue项目创建成功。

image.png

image.png

启动项目

1.在终端输入cd webapp进入项目目录。

image.png

2.输入npm run serve启动项目。看到下图所示就启动成功了!

image.png

3.进入本地网址查看你的项目。

image.png

4.回到终端按ctrl+c停止项目。

image.png

最后修改:2022 年 11 月 30 日
如果觉得我的文章对你有用,请随意赞赏