vue-cli结合vuex架构目录

1、安装vue-cli
npm install vue-cli
2、安装之后初始化应用，用node进行初始化，选择盘符
1. 执行 vue init webpack vue-demo
2. 进入创建的项目 cd vue-demo
3. 安装依赖报 npm install
4. 启动服务 npm run dev
5. 浏览器输入localhost:8080进行测试访问
以上解释:初始化一个项目名为vue-demo的应用，并选择使用 webpack 打包方式。在命令行中按照提示选择初始化配置项。
3、中型到大型项目目录结构(根据官方指导)

目录结构解释：

• build：文件是 webpack 的打包编译配置文件。
• config：文件夹存放的是一些配置项，比如我们服务器访问的端口配置等
• App.vue:根组件，所有的子组件都将在这里被引用。
• main.js:入口文件的 js 逻辑，在 webpack 打包之后将被注入到 index.html 中。
• static:放置的是非组件的资源，比如图片，字体等。
• index.html:整个项目的入口文件，将会引用我们的根组件。
• src：功能区
  
  • api或util：抽取的公共请求或方法。
  • assets：放置的是组件的资源，比如组件的图片，字体等。
  • components：存放vue组件。
  • router:存放vue路由。
  • vuex：存放状态管理文件
    
    • actions.js：处理methods的dispatch过来的名称与之对应，并提交到mutations。
    • getters.js：存放共用的 Computed Getters，实现在多个组件之间的共享。
    • mutation-types.js：定义总的不同事件的类型，方便modules文件中的模块去用。
    • modules：存放不同的模块功能区，里面可以有自己的actions、mutations，store等。
    • store.js：存放把modules文件下的多个模块集合在一起来创建 Vuex 实例,并导出 store。