首次用VSCode开发Vue项目的几个关键步骤

开发环境部署：

1. 安装Visual Studio Code

2. 安装node.js

3. 运行Visual Studio Code，新建终端，输入命令安装：npm install

4. 继续在终端输入命令安装：npm install -g vue-cli

5.继续在终端输入命令安装：npm install -g webpack

6.在C:\Windows\System32目录中，输入命令：set-executionpolicy RemoteSigned

   这条命令确保避免指令vue init webpack myvue创建VUE项目时报错！

上述完成了开发环境的部署。

首次VUE项目的创建、调试和生产部署

1. 指令方式创建VUE项目，并初步运行。

    运行Visual Studio Code，新建终端，进入自己选定的目录，输入命令启动首个VUE项目，命令如下：

 vue init webpack myvue

其中myvue是项目名称，之后需要根据实际填写和选择几项内容：   

至此，完成项目myvue的创建，目录中出现myvue目录，进入myvue目录，可以继续输入npm run dev命令进行初步运行，在浏览器里输入:http://localhost:8080，看到如下画面就是成功了。

2. 打包部署在Tomcat Apache环境运行

（1）VSCode打开myvue目录

  (2) 首先注意，需要对index.js的build:{}中的assetsPublicPath值'/'改成'./', 否则部署后，页面路径错误导致页面不显示。

 (3) 新建终端，进入myvue目录，输入命令打包：npm run build，等完成后，生成dist目录

 (4) 把dist目录复制到Tomcat Aapche的webapp目录中，运行启动Tomcat Apache，在浏览器中输入：http://localhost:8080，看到调试一样的画面就成功了。