使用VScode创建第一个Vue项目

使用VScode创建第一个Vue项目

推荐使用HBuilder直接创建：

一、确认必要环境已安装

vscode和nodejs必须安装好

vscode下载地址：https://code.visualstudio.com/Download

nodejs下载地址：https://nodejs.org/en/download

二、创建一个项目目录并使用VScode打开文件

创建项目文件夹并定位到项目目录下：

File->Open Folder打开

三、 安装vue-cli脚手架（如果之前装了，跳过）

vue-cli可以帮助我们快速构建vue项目。

Terminal（终端）->New Terminal打开终端执行命令：npm install -g vue-cli

四、 安装webpack打包工具（如果之前装了，跳过）

webpack是js的打包工具

在终端中执行命令：npm install -g webpack

五、 创建VUE项目

终端中输入：vue init webpack vuetest

如果报如下错误：
解决办法：

a：在windows系统中打到windows powerShell,并以管理员身份运行它

b：输入set-ExecutionPolicy RemoteSigned 回车

c：输入Y确认

六、运行项目

执行命令：cd vuetest

执行命令：npm run dev

浏览器访问：http://localhost:8080

七、项目打包发布线上

重新打开一个终端

输入命令：npm run build

会在项目目录中生成一个dist的文件夹，将此文件夹放到nginx容器中即可运行。