上一期已经介绍了如何创立第一个vue项目,如有不懂,请看链接(里面也有下载visual studio)vue建立项目
现在我们来讲讲在visual studio 新建立项目
1、安装完成后,启动VS
点击创建新的项目,找到红色框的项目点击创建就好了(我不知道这两个有什么区别,就不细讲了,知道的小伙伴可以留言告诉我一下)
接着就是更改项目路径,创建完了以后,项目中包含
如下文件,我大概打开看了一下,因为vue都是模块化开发,所以新创建文件都在components中
a、index.html就是前端文件,里面应该就是我们以前写html的layout,里面都是公用的一些标签
b、App.vue我觉得像路由(因为第一次创建项目,还不知道路由到底是什么,先暂且这么定义吧),里面的代码沿着引入别的文件---放在自己的页面的流程,而且红色框框里面的缺一不可
百度里面说(App.vue是我们的主组件,所有的页面都在App.vue下进行切换。我们可以将router标示为App.vue的子组件),我先放在这,以后检验。
经检验:App.vue就跟基础页面一样,所有页面切换都走这个页面
注:vs注释代码,是选中以后点这个就好
c、home.vue就跟我们之前的前端文件里面一样,只不过将html放在了template里面(注意:template里面的元素要先有一个总的div包裹所有别的标签,不然引入会有问题,这或许和vue模块化开发有关,一个页面是一个模块)
d、如果要新增页面,则在components新增文件,文件名为demo1,然后再App.vue里面添加代码,就可以渲染出来
完事啦,周末到了,大家周末愉快呀~~~