关于 web 前端自动化

Question

可以讲一下 在工作中 ，启动一个项目，作为前端需要做哪些准备吗，
比如在前端开发中需要用到的sass less，

这些在开发中是如何 按规范开发 和部署呢？

比如在开发一个移动端的大型商城， 前端需要到哪些工具呢？ 看了 大神前端的开发代码，用了好多辅助的开发工具啊， 能有一个详细的 介绍一下 大神在开发过程中是如何做呢

Answer 1

一、在开始一个项目前，前端要考虑的事情还蛮多的，根据我的经验列以下几个：
1 编译Sass或less文件，然后合并压缩成min文件
2 编译coffeescript（或直接使用javascript），然后合并压缩成min文件
3 选择合适的模板
4 考虑浏览器兼容性，选择是否使用css prefix
5 根据浏览器和项目需求，考虑使用那个前端框架，或者不使用
6 考虑是否使用UI框架（越往后越觉得没必要使用）

二、这些没什么标准，前端不像后端，有问题改改就好了，不会破坏整个网站。重要的是选择合适的工具和流程，例如你要做webapp，那么你可以不必太在意文件压缩的问题，因为不用下载到客户端。然后考虑的框架也会不同，例如cordova就一般与angularjs或reactjs使用，而很少夹个jquery。即使不喜欢用，前端其实还可以换工具，只是麻烦点，前端比后端灵活多了。

三、一个大型的网站用到的工具不是一开始就一大堆的，往往是需要的时候就加一个，然后慢慢拼大起来的。如何选择自动化工具才是个问题，例如集大成的IDE都有自动化工具，但往往不适合团队使用。现在最常用的，也是最流行的就是Node.js的自动化工具。你可以配合使用gulp（推荐）或者grunt，当你有需求就加一个，慢慢地你也能配置一个大规模的自动化流程工具。

Answer 2

强烈建议使用
fis

Answer 3

强烈建议使用
fis

Answer 4

1、工程构建：目前用的比较广泛的插件有fis3，gulp,grunt。或者webpack。很多人会说webpack不适合工程构建。这个要看你使用什么场景。目前的话，使用最广泛的可能是gulp，组件多而齐全。
2、技术点，目前前端市场一片蓝海，各种框架如雨后春笋，推荐几个吧：angular,react,vue.js

Answer 5

先来看看基础的 http://segmentfault.com/q/1010000003015428/a-1020000003020421

Answer 6

这个是一个工具栈，要用到的工具或插件比较多：

1、自动化构建工具 gulp、webpack、grunt（gulp未来会更流行）
2、自动化构建工具的各种插件（这里面要根据需求用到各种对应的插件）

• 学习自动化构建工具本事是很容易的事情

• 耗时的地方在于寻找最佳的构建流插件

• 和搭建最佳项目实践

使用http://yeoman.io，做脚手架工具（也就是项目模版），配合 generator-gulp-webapp，快速生成gulp应用模版，直接可以进行开发和使用，日后可以慢慢研究模版里面用到的工具和插件，把它当作一个学习目录也是不错的

generator-gulp-webapp是一个很不错的“最佳实践”