前端们,你们是怎么使用构建工具的

2016-01-06 16:31:50 +08:00
 123s
做了几年前端,都是刀耕火种。因为项目需要,从 fis 和 glup 中选了 fis 。试用后,喜欢它的 css 合并,自动加 hash ,还有打包等。现在有个问题:

我的资源 --> static 下有 css,js,images 三个文件夹。比如我合并 css 下的 css1 和 css2 ,然后再打包成 css3 。那么我这个文件放哪好,因为一开始这个文件是不存在的, js 的同理。初次使用,大家帮帮忙。

比如我在一个页面引用css1,css2,css3三个文件,但是构建后,因为css1和css2合并了,我只需要引用两个文件。 怎么处理...
4127 次点击
所在节点    程序员
21 条回复
Jaylee
2016-01-06 16:37:03 +08:00
一般会有两个目录,一个 src ,一个 dist ,打包之前的代码都在 src 目录下面,打包好之后放到 dist 目录下。
hellokittyer
2016-01-06 16:39:40 +08:00
源码:./src/ j|s|i|...
开发预览调试:./dest/ ...
最后生成个线上版本./build/ ...
chairuosen
2016-01-06 16:40:52 +08:00
关于最后一个问题, gulp 有 usemin 之类的工具,不清楚 fis
123s
2016-01-06 16:42:17 +08:00
@hellokittyer 感觉不会用...
Pastsong
2016-01-06 16:43:29 +08:00
现在流行 gulp 和 webpack
djyde
2016-01-06 16:43:39 +08:00
我个人来说,前端资源的 bundle 已经完全转移到 webpack 了。。。当然要看你项目的规模,如果只是小项目,用 gulp 就可以了, webpack 反而显得重。

合并过(或者说是 compile 过)的 css/js/images 可以放在另一个目录里(比如 /build )。

建议在 Github 看看别人是怎么组织目录的
NemoAlex
2016-01-06 16:46:40 +08:00
每个 css 和 js 文件也都 minify 一下,合并的归合并的,单用的话也能用。
这是最简单的办法。
cyio
2016-01-06 16:54:31 +08:00
之前用的 fis3 ,入门挺好。最近遇上坑给抛弃了,迁移到了 gulp 。

时间长了,工具坑不可避免,以后尽量选社区用户多的。国产大公司的东西尽量绕开。
LT
2016-01-06 16:59:40 +08:00
哦. 功能插件那么多,自己组合整个呗,省得写那么多配置文件
learnshare
2016-01-06 17:01:28 +08:00
用国际主流的, gulp 能满足目前的需求
aivier
2016-01-06 17:26:11 +08:00
一般不用,因为同事根本不知道这些,他们都在用 DreamWeaver
123s
2016-01-06 17:55:17 +08:00
@aivier ....
不能这样,这次一定要用。
bdbai
2016-01-06 18:14:34 +08:00
@aivier Dreamweaver 组织出来的 DOM 能看?
gaowhen
2016-01-06 18:27:29 +08:00
安利下常用 gulp task https://github.com/gaowhen/task-master
lococo
2016-01-06 23:19:16 +08:00
js 打包后生成的文件放在 static 目录里的 js/pkg 下, css 同理…
yangxiongguo
2016-01-07 00:53:06 +08:00
gulp+webpaxk
gulp 处理 less ,移动资源文件等大部分操作。
webpack 处理 js 模块。
aivier
2016-01-07 08:43:53 +08:00
@bdbai 手写的,但是缩进乱七八糟,我也不想看

@123s 用了之后同事说他们不会用,让我改回去
Matrixbirds
2016-01-07 11:21:47 +08:00
在下认为还是 gulp 会舒服一些 fis 的文档和插件就很蛋疼
RaymondYip
2016-01-07 11:47:25 +08:00
webpack
bdbai
2016-01-07 18:20:28 +08:00
@aivier Dreamweaver 明明有格式化代码的功能诶

这是一个专为移动设备优化的页面(即为了让你能够在 Google 搜索结果里秒开这个页面),如果你希望参与 V2EX 社区的讨论,你可以继续到 V2EX 上打开本讨论主题的完整版本。

https://www.v2ex.com/t/248812

V2EX 是创意工作者们的社区,是一个分享自己正在做的有趣事物、交流想法,可以遇见新朋友甚至新机会的地方。

V2EX is a community of developers, designers and creative people.

© 2021 V2EX