• 从零开始Vue项目实战(三)-项目结构


    目录结构
    
    ├── README.md            项目介绍
    ├── index.html           入口页面
    ├── build              构建脚本目录
    │   ├── build-server.js         运行本地构建服务器,可以访问构建后的页面
    │   ├── build.js            生产环境构建脚本
    │   ├── dev-client.js          开发服务器热重载脚本,主要用来实现开发阶段的页面自动刷新
    │   ├── dev-server.js          运行本地开发服务器
    │   ├── utils.js            构建相关工具方法
    │   ├── webpack.base.conf.js      wabpack基础配置
    │   ├── webpack.dev.conf.js       wabpack开发环境配置
    │   └── webpack.prod.conf.js      wabpack生产环境配置
    ├── config             项目配置
    │   ├── dev.env.js           开发环境变量
    │   ├── index.js            项目配置文件
    │   ├── prod.env.js           生产环境变量
    │   └── test.env.js           测试环境变量
    ├── mock              mock数据目录
    │   └── hello.js
    ├── package.json          npm包配置文件,里面定义了项目的npm脚本,依赖包等信息
    ├── src               源码目录  
    │   ├── main.js             入口js文件
    │   ├── app.vue             根组件
    │   ├── components           公共组件目录
    │   │   └── title.vue
    │   ├── assets             资源目录,这里的资源会被wabpack构建
    │   │   └── images
    │   │      └── logo.png
    │   ├── routes             前端路由
    │   │   └── index.js
    │   ├── store              应用级数据(state)
    │   │   └── index.js
    │   └── views              页面目录
    │      
    ├── static             纯静态资源,不会被wabpack构建。
    └── test              测试文件目录(unit&e2e)
      └── unit              单元测试
          ├── index.js            入口脚本
          ├── karma.conf.js          karma配置文件
          └── specs              单测case目录
              └── Hello.spec.js
    

    vue组件命名规范
    单文件组件的文件名应该要么始终是单词大写开头 (PascalCase),要么始终是横线连接 (kebab-case)。

    在views文件夹下新建三个文件 home-page.vue和not-found.vue,login.vue,signup.vue,文件夹user,article,invest

  • 相关阅读:
    基于发布/订阅模型的应用程序的主循环设计
    C++使用继承时子对象的内存布局
    安装 CentOS 后的系统配置及软件安装备忘
    环形无锁队列
    并发编程基础
    线程池实现
    Git远程操作
    Unix权限管理
    jquery中,某些写法后来更新导致版本不支持的替代方法
    js相关
  • 原文地址:https://www.cnblogs.com/dreamingbaobei/p/9823469.html
Copyright © 2020-2023  润新知