vue全家桶（一）
#2.3。示例使用单文件组件完成如下页面我们之前已经讲过使用vue-cli创建项目后需要在src目录下编写相应的代码1.新建一个MyHeader.vue文件在src目录下的components目录下，添加如下内容{{title}}
1.环境建设#1.1。脚手架施工#1.1.1什么是脚手架？百度搜索脚手架是什么样子的。他们是这样的：我从百度百科里抄了一段话：脚手架是为了保证每一个施工过程顺利进行而搭建的工作平台。如果了解脚手架在现实生活中的作用，那么在编程中理解脚手架就很容易了。有时我们会听说前端脚手架工具。其实这里的脚手架和现实中的脚手架差不多。用人的话来说，它是一种工具，工地上的脚手架帮助工人施工，前端的脚手架帮助程序员完成各种工作，如：代码编译、打包、压缩等，各种工具组合成一个编码环境。这种一步步搭建环境的重复劳动完全可以交给脚手架工具来完成。你只需要在这个脚手架工具上完成自己的业务代码。接下来介绍vue-cli是一个集成vue的脚手架工具。同样，react、Angular等都有相应的脚手架工具，如：create-react-app、angular-cli等。#1.1.2.vue-cli介绍在没有vue-cli之前，你可能需要花一个几天搭建开发环境。如果不熟悉webpack，就得重新学习webpack的各种配置，这样几天很快就过去了，还没有真正开始写自己的应用逻辑。从配置中解脱出来，vue官方提供了一套vue-cli脚手架，既保证了基于智能默认配置的各种构建工具的平滑衔接，又提供了配置调整的灵活性。使用vue-cli，您可以专注于编写项目的业务逻辑。来自官网：VueCLI是一套完整的基于Vue.js快速开发的系统，提供：通过@vue/cli搭建交互式项目脚手架。使用@vue/cli+@vue/cli-service-global快速开始零配置原型设计。运行时依赖项（@vue/cli-service）是：可升级；建立在具有合理默认值的webpack之上；可通过项目内配置文件进行配置；可通过插件扩展。丰富的官方插件集合，集成了前端生态系统中最好的工具。用于创建和管理Vue.js项目的全图形用户界面。#1.1.3。使用vue-cli#1.2创建项目。项目目录介绍及相关配置二、单文件组件在vue基础入门课程中，我们讲了vue是如何注册组件的。我们使用Vue.component定义全局组件，后面用newVue({el:'#container'})在每个页面指定一个容器元素，在小规模的项目中效果很好，但是在复杂的项目中会有缺点很多，因此，我们不推荐使用Vue.component来定义组件，而是使用单文件组件#2.1。什么是单文件组件？通俗地说，单文件组件就是每个文件都是一个组件，不同的组件放在不同的文件中。这种文件以.vue#2.2结尾。单文件组件结构单文件组件由三部分组成，即Template、js、css三部分，例如：
{{message}}我是首页 