vue-cli脚手架工具为我们搭建了开发所需要的环境，有必要对这个环境进行熟悉。例如：名为vuecliTest的项目目录
一.简要介绍
1.build文件夹：项目构建（webpack）相关代码
2.config文件夹：项目开发环境配置文件
3.node_modules文件夹：npm依赖的包管理
4.src文件夹：项目源码放在此文件夹下
5.static文件夹：项目静态文件夹目录。图片，json数据
6..babelrc文件：Babel解释器的配置文件，存放在根目录下。Babel是一个转码器，项目里需要用它将ES6代码转为ES5代码。
|-- build // 项目构建(webpack)相关代码
| |-- build.js // 生产环境构建代码
| |-- check-version.js // 检查node、npm等版本
| |-- dev-client.js // 热重载相关
| |-- dev-server.js // 构建本地服务器
| |-- utils.js // 构建工具相关
| |-- webpack.base.conf.js // webpack基础配置
| |-- webpack.dev.conf.js // webpack开发环境配置
| |-- webpack.prod.conf.js // webpack生产环境配置
|-- config // 项目开发环境配置
| |-- dev.env.js // 开发环境变量
| |-- index.js // 项目一些配置变量
| |-- prod.env.js // 生产环境变量
| |-- test.env.js // 测试环境变量
|-- src // 源码目录
| |-- components // vue公共组件
| |-- store // vuex的状态管理
| |-- App.vue // 页面入口文件
| |-- main.js // 程序入口文件，加载各种公共组件
|-- static // 静态文件，比如一些图片，json数据等
| |-- data // 群聊分析得到的数据用于数据可视化
|-- .babelrc // ES6语法编译配置
|-- .editorconfig // 定义代码格式
|-- .gitignore // git上传需要忽略的文件格式
|-- README.md // 项目说明
|-- favicon.ico
|-- index.html // 入口页面
|-- package.json // 项目基本信息二.重要文件介绍
1.package.json文件是项目根目录下的一个文件，定义该项目开发所需要的各种模块以及一些项目配置信息（如项目名称、版本、描述、作者等）。
package.json 里的scripts字段
在开发环境下，在命令行工具中运行npm run dev 就相当于执行 scripts字段dev语句；在生产环境下，在命令行工具中运行npm run build 就相当于执行 scripts字段build语句；
dependencies字段和devDependencies字段
dependencies字段指项目运行时所依赖的模块；devDependencies字段指定了项目开发时所依赖的模块；
2.dev-server.js文件：可以在此文件中更改端口号（在build文件夹下）
3..editorconfig文件
该文件定义项目的编码规范，编译器的行为会与.editorconfig文件中定义的一致，并且其优先级比编译器自身的设置要高。
root = true
[*] // 对所有文件应用下面的规则
charset = utf-8 // 编码规则用utf-8
indent_style = space // 缩进用空格
indent_size = 2 // 缩进数量为2个空格
end_of_line = lf // 换行符格式
insert_final_newline = true // 是否在文件的最后插入一个空行
trim_trailing_whitespace = true // 是否删除行尾的空格三.src下的源码文件
1.main.js文件
main.js是整个项目的入口文件,在src文件夹下：通过代码可以看出这里引进了App的组件和<App/>的模板，它是通过 import App from ‘./App’这句代码引入的。 我们找到App.vue文件，打开查看。
2.App.vue文件
<template></template>标签包裹模板的HTMLDom结构；<script></script>标签包括的js内容；<style></style>标签包裹的css内容；
3.router/index.js路由文件
我们可以看到 import Hello from ‘@/components/Hello’这句话， 文件引入了/components/Hello.vue文件。这个文件里就配置了一个路由，就是当我们访问网站时给我们显示Hello.vue的内容。