This topic created in 4327 days ago, the information mentioned may be changed or developed.
我之前一直是把js和css分写在两个文件中的,比如main.js和main.css。
但是这显然不适应大一点的项目,于是就按照页面分开,比如page1.js,page1.css.
但是发现其实有很多页面上的组件是可以复用的,那么复用的这部分的js和css又该怎么写?
来讲讲你在开发中怎么组织css和js代码吧!
14 replies • 2014-09-23 21:36:26 +08:00
 |
|
1
otakustay Sep 23, 2014
标准分层,site -> module -> page,分别放全站通用、某模块通用(如用户模块)、页面专用,这3层都可以有多个css文件组成
js可以类似
|
 |
|
4
jsonline Sep 23, 2014
<head> <!-- @@include = ../partials/meta.html -->
<!-- @@include =../partials/css_base.html -->
<!--build:css(dist) /static/styles/project/master.html.css--> <link rel="stylesheet" href="/static/styles/project/layout.css"/> <link rel="stylesheet" href="/static/styles/project/siteHeader.css"/> <link rel="stylesheet" href="/static/styles/project/siteFooter.css"/> <link rel="stylesheet" href="/static/styles/project/modal.css"/> <link rel="stylesheet" href="/static/styles/project/signinForm.css"/> <link rel="stylesheet" href="/static/styles/floatBar.css"/> <link rel="stylesheet" href="/static/styles/requirementPopup.css"/> <!--endbuild-->
<!-- @@placeholder = head -->
<!--[if lte IE 8]> <script src="/static/vendors/html5shiv.min.js"></script> <![endif]-->
<!-- @@include = ../partials/favicon.html -->
</head>
|
 |
|
5
jsonline Sep 23, 2014
CSS 按模块分为很多文件,各页面各取所需。 JS 同理。 HTML 同理。
|
 |
|
6
jsonline Sep 23, 2014
把CSS/JS按照HTML的名字来命名一定会悲剧的。 除非你的代码特别特别少。
|
 |
|
7
gangsta Sep 23, 2014
个人习惯:
webRoot/
assets/ bootstrap/ css/ js/ images/ jQuery/ js/ font-awesome/ css/ images/ static/ css/ js/ img/
index.html
大点的库都用一些速度快的CDN了
|
 |
|
8
learnshare Sep 23, 2014
参考 Bootstrap 等复杂的前端项目吧。项目复杂了,模块化、自动化等工作是很重要的
|
 |
|
9
gangsta Sep 23, 2014
我去 缩进被吃掉了...
|
 |
|
10
otakustay Sep 23, 2014
@ kokdemo 我不知道我们2个对上下的理解是不是一致,我的概念里越多地方会用的东西越下层,所以site是最下层……
|