目录结构

上面这张图是salut的目录文档,从github上将其下载后直接运行node run和 node json 可以直接启动项目。下面逐个介绍每个目录的存放的文件和作用。

construction

该目录下存放着工程文件,grunt配置文件以及几本requireJS,在此处运行npm install 可以安装工程的依赖模块。app.js 是项目入口文件。require是html中唯一用script标签引入的js文件。Gruntfile是grunt的配置文件。开发文档该项目的api说明文档。格式是md的,可以用解析文件查看。

css

该目录下存放着css样式文件,app是业务的样式文件,你写的每个界面的样式代码都存放在里面。pdw是基础的css,一些公共和基础底层的css代码写在该文件中,当然你可以任意地改写或者直接重写它。但我建议你覆盖这些css样式而不是删除。否则会出现难以预估到的样式错误。

fonts和img

存放的你自己的字体和图片

js

js目录下又分了好几层目录:js/base目录下存放Salut的核心代码;js/core存放backbone库以及它依赖的underscore和zepto;js/plugins存放着各种第三方插件,改工程默认是不加载任何插件的,被加载的插件需要符合amd规范,之后会详细解释它的加载规则;js/tpl中储存的是所有界面的模板文件;js/use下是每个界面的业务代码,界面展示的时候是根据需要下载这些文件的。Config是该项目的默认配置文件。还有一个map.html文件,该文件在处理地图文件的时候用到。

node

该文件下存放是项目的后台输出数据文件,实际开发中没用处,旨在为了本地查看示例。

run和page_main.html

run.js也是启动node服务文件,演示例的时候运行node run即可将项目跑起来。page_main则是项目的主体html片段。

命名规则

在按照以上目录结构搭建好了几本架子之后我们可以开始创建一个几本的界面。在js/use中创建一个js,以驼峰形式命名。紧接着在js/tpl中创建对应的模板文件。命名规则是以tpl开头,对应js结尾。但请注意,tpl后的第一个字母必须小写,后缀为.html。

结束

以上便是salut的基本目录结构。从你下载那时起他就已经创建好了,你只需要按照自己的需求在js/use和js/tp中添加业务文件即可。当然,如果你能够灵活地配置文件创建对应的目录,它也是可以很好的运行的。github地址如下:

https://github.com/constantince/Salut

快速构建SPA框架SalutJS--项目工程目录 二的更多相关文章

  1. 快速构建SPA框架SalutJS--项目工程目录 一

    起因 刚进公司那会儿,接的是一个微信APP应用,SPA是前人搭起来的,用到的技术主要是backbone和zepto.后来那人走了,就卤煮一个人把项目接了下来.项目越是到后面,越发觉了诸多弊端,不停的增 ...

  2. 快速构建SPA框架SalutJS--项目工程目录 三

    配置文件 在开始我们的第一个界面之前,我们需要把初始的html和config文件配置好.html非常简单,只需要一个div作为最外部的容器包裹着所有界面即可: <!DOCTYPE html> ...

  3. 使用 Spring Boot 快速构建 Spring 框架应用--转

    原文地址:https://www.ibm.com/developerworks/cn/java/j-lo-spring-boot/ Spring 框架对于很多 Java 开发人员来说都不陌生.自从 2 ...

  4. 使用 Spring Boot 快速构建 Spring 框架应用,PropertyPlaceholderConfigurer

    Spring 框架对于很多 Java 开发人员来说都不陌生.自从 2002 年发布以来,Spring 框架已经成为企业应用开发领域非常流行的基础框架.有大量的企业应用基于 Spring 框架来开发.S ...

  5. 使用 Spring Boot 快速构建 Spring 框架应用

    Spring 框架对于很多 Java 开发人员来说都不陌生.自从 2002 年发布以来,Spring 框架已经成为企业应用开发领域非常流行的基础框架.有大量的企业应用基于 Spring 框架来开发.S ...

  6. Myeclipse项目工程目录中各种Libraries的含义

    MyEclipse工程目录下一般会有以下几类Libraries,如图: 各种Libraries的含义如下: JRE System Library:Java SE 的常用库文件集合,构建任何Java项目 ...

  7. Maven项目工程目录

    maven工程目录规范: src/main/java   存放项目的.java文件 src/main/resources   存放项目的资源文件,如spring.hibernate配置文件 src/t ...

  8. maven项目工程目录约定

    使用maven创建的工程我们称它为maven工程,maven工程具有一定的目录规范,如下: src/main/java —— 存放项目的.java文件 src/main/resources —— 存放 ...

  9. 快速构建hibernate框架

    手动配置Hibernate框架的配置,极易出现问题,在Eclipse的web项目中,我们可以快速配置,方便快捷 一.导入Hibernate框架所需要的jar文件 二. 窗口—Perspective—打 ...

随机推荐

  1. JavaScript 设计模式之----单体(单例)模式

    设计模式之--单体(单例)模式 1.介绍 从本章开始,我们会逐步介绍在JavaScript里使用的各种设计模式实现,在这里我不会过多地介绍模式本身的理论,而只会关注实现.OK,正式开始. 在传统开发工 ...

  2. Volley 图片加载相关源码解析

    转载请标明出处: http://blog.csdn.net/lmj623565791/article/details/47721631: 本文出自:[张鸿洋的博客] 一 概述 最近在完善图片加载方面的 ...

  3. yii2.0 app上集成支付宝支付

    1.首先从支付宝官网下载支付宝app支付sdk 地址 : https://doc.open.alipay.com/docs/doc.htm?spm=a219a.7629140.0.0.hLEa5O&a ...

  4. Python configparser 读取指定节点内容失败

    # !/user/bin/python # -*- coding: utf-8 -*- import configparser # 生成一个config文件 config = configparser ...

  5. objectid.go源码阅读

    )) } // func), ), ), ), ])<<])<<)]) } //获取])<<])<<])<<]), //转化为十进制的int ...

  6. bzoj 3343 教主的魔法 分块

    修改直接对整块打标记,两边暴力. 查询需要保证每个整块有序,所以在修改时排序就好啦 #include<cstdio> #include<cstring> #include< ...

  7. Java的LockSupport.park()实现分析(转载)

    LockSupport类是Java6(JSR166-JUC)引入的一个类,提供了基本的线程同步原语.LockSupport实际上是调用了Unsafe类里的函数,归结到Unsafe里,只有两个函数: p ...

  8. Angularjs interceptor

    angularJs 请求过滤 新建一个服务, $HttpProvider 中有一个 interceptore 数组,所谓的拦截器就是一个注册到该数组的工厂,该工厂在app.config() 中注入, ...

  9. create react app 项目部署在Spring(Tomcat)项目中

    网上看了许多,大多数都是nginx做成静态项目,但是这样局限性太多,与Web项目相比许多服务端想做的验证都很麻烦,于是开始了艰难的探索之路,终于在不经意间试出来了,一把辛酸... 正常的打包就不说了. ...

  10. 视频转字符动画-Python-60行代码

    更新:2018-5-21 注意: 最后一步播放字符动画使用了只支持类 unix 系统的模块 curses, 因此在windows上是播放不了的... 解决方法: 1. 最近好像有一个移植 https: ...