接下来我们来开始编程教程的必备入门实例，Hello world。
项目结构介绍
首先在开始我们的Hello world之旅之前，我们需要看下我们创建好的项目代码结构。
.
├── README.md
├── .gitignore # git提交时候的过滤文件
├── .editorconfig # 编辑器的项目配置文件，VScode需安装插件《EditorConfig for VS Code》才可生效。
├── babel.config.js # 向后兼容ES语法
├── node_modules # 依赖目录
├── package-lock.json # 锁定安装时的依赖的版本
├── package.json # 名称、描述和版本之类的信息，以及运行、开发以及有选择地将项目发布到 NPM 所需的信息
├── public # 公共文件
│ ├── favicon.ico # 标签栏看到的小图标
│ └── index.html # 编译打包的模版文件
└── src # 项目的主文件目录
├── App.vue # 基础组件
├── assets # 存放静态资源，例如图标、图片等
├── components # 组件的存放路径
├── main.js # 项目入口文件
├── router # 路由文件存放的目录
├── store # 状态管理文件存放的目录
└── views # 页面存放路径Hello world
在 views 里创建 hello-world.vue 的文件
<template>
<div>
Hello world!!!
</div>
</template>在 router/index.js 中创建路由
然后启动程序（npm run serve），访问 http://localhost:8080/hello-world 即可访问到 Hello world 的页面
