这是一个创建于 3500 天前的主题，其中的信息可能已经有所发展或是发生改变。
我之前一直是把js和css分写在两个文件中的，比如main.js和main.css。
但是这显然不适应大一点的项目，于是就按照页面分开，比如page1.js，page1.css.
但是发现其实有很多页面上的组件是可以复用的，那么复用的这部分的js和css又该怎么写？
来讲讲你在开发中怎么组织css和js代码吧！
但是这显然不适应大一点的项目，于是就按照页面分开，比如page1.js，page1.css.
但是发现其实有很多页面上的组件是可以复用的，那么复用的这部分的js和css又该怎么写？
来讲讲你在开发中怎么组织css和js代码吧！
 |
1
otakustay 2014-09-23 16:54:07 +08:00
标准分层，site -> module -> page，分别放全站通用、某模块通用（如用户模块）、页面专用，这3层都可以有多个css文件组成
js可以类似 |
 |
3
jsonline 2014-09-23 17:50:47 +08:00
https://github.com/FrankFang/gulp-html-extend
你需要用到自动化复制粘贴工具 |
|
4
jsonline 2014-09-23 17:51:44 +08:00
<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 2014-09-23 17:52:48 +08:00
CSS 按模块分为很多文件，各页面各取所需。
JS 同理。 HTML 同理。 |
|
6
jsonline 2014-09-23 17:54:04 +08:00
把CSS/JS按照HTML的名字来命名一定会悲剧的。
除非你的代码特别特别少。 |
 |
7
gangsta 2014-09-23 18:20:51 +08:00
个人习惯:
webRoot/ assets/ bootstrap/ css/ js/ images/ jQuery/ js/ font-awesome/ css/ images/ static/ css/ js/ img/ index.html 大点的库都用一些速度快的CDN了 |
 |
8
learnshare 2014-09-23 18:21:23 +08:00
参考 Bootstrap 等复杂的前端项目吧。项目复杂了，模块化、自动化等工作是很重要的
|
|
9
gangsta 2014-09-23 18:21:33 +08:00
我去 缩进被吃掉了...
|
 |
11
guotie 2014-09-23 20:34:20 +08:00
duo
|
Select Language