使用vscode建立一个vue.js工程完整过程

一、安装vscode

vscode下载链接

二、在 vscode中安装、使用 Vue.js

step1  打开vscode,打开你工程将放的文件夹,我这里是想放在web1里面,所以打开它:

使用vscode建立一个vue.js工程完整过程

然后点击vscode的terminal(终端),打开集成终端:查看 –> 集成终端 或者直接按 ctrl+`

如果没有安装vue-cli,在终端输入:

npm install -g vue-cli 
全局安装vue-cli,如果安装了就跳过这步

然后在终端里面输入命令行:vue init webpack projectName,projectName换为你想要的名字。我的是mytest

使用vscode建立一个vue.js工程完整过程

然后一直按确认或输入y按确认,等待项目初始化,如下图

使用vscode建立一个vue.js工程完整过程

项目完成后,运行terminal提示的黄色字体的两段命令

使用vscode建立一个vue.js工程完整过程

然后打开浏览器输入terminal里面提示的网址,就可以看到你的第一个vue.js工程了,后续可以在这上面的代码的基础上修改自己的代码。

使用vscode建立一个vue.js工程完整过程

使用vscode建立一个vue.js工程完整过程