vue项目结构分析

public 用于放置静态资源的目录

        |—— favicon.ico 浏览器title图标

        |—— index.html 静态index.html

src 项目代码核心目录

        |—— api 用于放置接口请求的封装

        |—— assets 用于放置css文件以及图片的目录

        |—— router  配置vue路由的目录

        |—— store vuex 数据管理，一般将用户信息和登陆信息等存储在里面

        |—— utils 放置一些工具方法

        |—— views 放置核心vue页面的地方，也是日常开发最主要的目录

        |—— App.vue 项目的入口vue文件，如无特殊需求，尽量不要在该文件中开发业务逻辑

        |—— main.js 项目的入口js文件，用于初始化vue实例以及存储全局变量

tests  单元测试目录

.eslintrc.js ——eslint的配置文件

.gitignore ——配置不参与git提交的文件的地方

babel.config.js ——babel的配置文件

jsconfig.json ——主要与vscode配合，提高vscode的性能

package.json ——使用的npm包(serve:开发环境 build:打生产包)

package-lock.json ——锁定安装时的包的版本和包依赖的版本号，以保证其他人在使用npm install时下载的依赖包都是一致的

README.md 项目的说明文档

vue.config.js ——打包的配置文件，将webpack所有配置进行集成，做了环境配置的修改，devServer:在本地起服务，起类似代理作用

yarn.lock—— 如果是通过yarn运行项目，则会起到锁定版本的作用，如果是通过npm运行项目，则用不到该文件

日常开发注意事项：

1、日常开文件放置地方：

vue页面应放置在views目录下，

css文件和图片放置在assets目录下，

接口请求需封装好放置在api目录下，

工具方法等放置在utils目录下

2、vue内部的css书写，一定要加scoped！