zoukankan      html  css  js  c++  java
  • vue项目目录结构详解

    项目简介

    基于 vue.js 的前端开发环境,用于前后端分离后的单页应用开发,可以在开发时使用 ES Next、scss 等最新语言特性。项目包含:

    基础库: vue.js、vue-router、vuex、whatwg-fetch
    编译/打包工具:webpack、babel、node-sass
    单元测试工具:karma、mocha、sinon-chai
    本地服务器:express

    目录结构

    ├── 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              页面目录
    
    │    ├── hello.vue
    
    │    └── notfound.vue
    
    ├── static             纯静态资源,不会被wabpack构建。
    
    └── test              测试文件目录(unit&e2e)
    
      └── unit              单元测试
    
        ├── index.js            入口脚本
    
        ├── karma.conf.js          karma配置文件
    
        └── specs              单测case目录
    
          └── Hello.spec.js

    来源于:传送门

  • 相关阅读:
    easyui validatebox textbox 取值和赋值
    linq中如何在join中指定多个条件
    easyui datagrid 表头固定(垂直滚动条)、列固定(水平滚动条)
    JS Jquery 中 的遍历
    EasyUI datagrid formatter 属性
    基于C#的socket编程的TCP异步实现
    Winform 最小化双击显示,最小化右键退出。退出
    C#中的Invoke
    Socket之listen() receive()
    20210512学习笔记--一直没干啥有用的事儿,最主要还是量变不够,进展过于慢了
  • 原文地址:https://www.cnblogs.com/JonaLin/p/12580329.html
Copyright © 2011-2022 走看看