Vue2.X项目结构讲解

首先需要安装node.js和vue-cli。 创建项目指令：$ vue create vue-demo(项目名称) 可以选择默认配置，也可以自己配置sass/less预编译语言、router路由、vuex状态管理工具、eslint语法校验工具、路由模式等。 基本目录结构如下 node_modules👉第三方依赖包存放目录，此目录下的文件不会push到git远程仓库上。此目录不需要手动创建，使用npm或yarn命令安装第三方依赖会自动生成。 public👉外部静态文件存放目录，如index.html，全局配置文件config.js。 src/assets👉内部静态文件存放目录，如fontawesome字体图标源文件、项目可能用到的图片素材等。 src/components👉项目公共组件存放目录，多个地方都用到的组件我们会提取到一个vue文件完成并存放至此，其它vue文件通过import方式引入，这不仅可以大大减少代码量，维护时也只需修改一份代码，这是vue特色之一！ src/router👉入口文件index.js为搭建项目自动生成，主要配置路由与vue文件的关系，即指定某个路由url为某个vue文件的内容。 src/store👉vuex状态管理目录，存在意义是解决父子组件间通信问题，相当于项目的一个公共资源中转站，谁都可以向它提交数据或请求数据，vuex是大型项目必不可少的工具！ src/utils👉自建目录，主要存放一些公共的js方法，与组件类似，使用时把它export出去并挂载至vue原型链中即可。 src/views👉页面存放目录，存放系统中的页面，建议内部目录结构与路由层级保持一致，方便维护及他人阅读代码。 src/App.vue👉可在此处style写全系统公共样式，以及系统启动事件等。 src/mani.js👉可在此处按需引入element等第三方组件、挂载vue原型链、配置路由守卫、配置全局filter过滤器等。 package.json👉此文件自动生成，主要用于记录项目需要的依赖包及版本、当使用npm install 或 yarn install 命令时，会根据此文件安装依赖包。 vue.config.js👉此文件现不会自动生成，需手动创建，主要完成项目的基础配置、如代理服务器、高德地图配置、基础目录、打包输出路径等。