搭建编程环境。
安装条件:Node.js版本要大于6.0。npm大于3.0(Node.js大于6.0的版本 里面npm版本大于3.0)。还有Git
详情见:https://github.com/vuejs/vue-cli/tree/master
安装Node环境http://nodejs.cn/
安装Git(VScode安装过了)
三种模板选择:
官方模板。自定义模板。本地模板
下面在安装好Node和Git后 调用windows的cmd
五个箭头分别表示:
1,返回桌面。
2,下载vue模板(webpack-simple这个模板)文件夹命名为 vue-bai
3,确认项目名字(不写默认文件夹名称)
4,项目描述(默认不修改)
5,确认邮箱(Git添加的Github的注册邮箱)
6,MIT是默认的证书。一般不需要修改
通过以上简单操作安装完成。桌面出现了一个新文件夹。名为vue-bai
接下来我们就要安装开发中的各种依赖
1,进入需要安装依赖的文件夹(我们刚刚配置下载的模板)
2,下载依赖
最后就是运行测试服务器。npm run dev 默认端口为8080
现在我们可以在src文件写我们需要的代码了
未完待续。。。。。。
关于配置文件解读
定义组件:(首先我引入了bootstrap框架)
在src中创建一个vue文件:创建了一个Balert.vue文件
引入组件和注册组件:
在main.js文件中
引入Balert组件:import Balert from './Balert.vue'
然后注册组件:Vue.component("app-alert",Balert) // 标签名为app-alert
完成以上操作。一个单页组件就完成了!
我们可以在单页面组件引入子组件。