工程目录简介
上一篇文章写了如何利用vue-cli3.0脚手架快速的搭建一个基于vue2.x的工程
这一篇文章就简单介绍一下工程目录结构。
|--dist 打包之后的发布目录
| |--css 存放打包之后的css文件夹
| |--img 存放打包之后的img资源文件夹
| |--js 存放打包之后存放的js文件夹
| |--index.html 存放打包之后的入口页面
|
|--mock 本地前端工程mock的一些数据
|
|--node_module 本地项目的第三方依赖
|
|--public
|
|--src 开发目录
| |
| |--assets 开发时候存放的一些静态资源
| |
| |--components 业务开发的组件
| |
| |--lib 开发过程中自己写的一些工具库
| |
| |-plugins
| |
| |-router 前端工程的路由，将其模块化，单独的拿出来
| | |
| | |-router.js 工程的路由配置
| |
| |-vuex vuex转态管理
| | |
| | |-store.js
| |
| |-App.vue 工程的入口文件，也是整个工程的根组件
| |-main.js 工程的入口文件，用以引入一些全局变量
| |-.gitignore 提交git仓库忽略的文件
| |-babel.config.js babel的一些配置
| |-package.json 依赖的第三方配置文件
| |-readMe.md 项目简单介绍
其中有一些文件目录不是vue create vue 跑出来的。比如vuex是后续在项目开发过程中添加的，这里一并罗列出各个文件夹下的一些路径，并注释其作用。
在vue-cli3中开发过程已经非常简化了
大体上开发过程中就会用到下面几个命令
- npm install 这个是项目开始的时候根据package.json安装所有的第三方依赖
- npm run serve 开发过程中本地启动一个本地服务调试我们所开发的组件
- npm run build 转移到生产环境上，将开发环境的代码打包。
其中我们关注的最多的就是src/component这个文件夹，这个文件夹下面有我们开发的所有业务组件。