web流行工具

 

中小型公司：

　　Node.js：現代工業化前端的基礎；

　　RequireJS：AMD規範，

　　即將過期的 JavaScript 模塊化方案；

　　Bower：前端模塊源；

　　npm；前端工具源，另外一個潛在的前端模塊源；

　　Browserify：即將過期的基於 CommonJS 的前端模塊化方案；

　　Less：等 CSS 加強工具；

　　Gulp：前端構建工具；

編輯器：

首推：VIM、Brackets
可選：atom、sublime、emacs
webstorm 那叫 IDE，不（僅僅）是編輯器

css工具：

苦於合做的同事一直選的是 bootstrap，我沒有認真比較過 sass 與 less 而直接一路用着 less，不過二者其實差不了多少。
如今貌似流行後處理器了（前面說的兩個叫預處理器，我也不知道他們差異在哪），autoprefixer 等，推薦看 Pleeease 這是一個這類工具的集合

模塊化工具：

首推：browserify 代碼架構清晰，你能夠本身拔插其中的某些部分，好比替換個 prelude（在瀏覽器裏怎麼加載模塊的代碼，默認是每一個編譯合併後的 js 都帶一小段），或者用諸如 factor-bundle 這樣的插件拎出共用組建來。由於架構清晰代碼量小，你能夠通讀源碼瞭解其原理。

其次：webpack，不得不說 webpack 很強大，若是要用 react 的話 react-hot-loader 這樣的插件目前只此一家。對我來講它的問題在於太龐大了，我沒法理清其全貌怕用在項目裏踩坑本身沒法解決。

不推薦：require.js sea.js，兩個都是要過期的東西，在我還沒成爲 sea.js 黑前，就是堅決的 require.js 黑了。二者的共同問題是要爲每一個文件寫首尾的 wrapper 在瀏覽器端去解決，而不是像前二者在開發部署階段去處理，require.js 問題最大，好歹 sea.js 還和 node.js 有所兼容。

流程工具/部署前處理：

部署前處理主要包括用前面的模塊化工具打包、生成版本號、壓縮文件等。我主要用 gulp 來作這些事，歷來都不會用也不喜歡 grunt，百度的 FIS 據說過但不瞭解，讀過 @張雲龍 的文章推測應該還不錯。個人建議是@張雲龍 的文章必讀而 FIS 可參考，最後用 gulp 來組織本身的工做流。

若是你用熟了 gulp，你可能會厭倦開工一個項目就想切個頁面也要擺好排場寫個幾十上百行的 gulpfile.js，這時你應該作減法，能夠向 substack 學學用 npm run （package.json 裏面的 scripts 屬性）或者像 ./task.js 這樣的幾行代碼便可。

包管理：

bower：用 github 來作源，國內使用很不堪，如 @yhben 的回覆「100k的js，克隆了一個50M的項目」。它可能簡化了一點點你去 github 上搜索代碼下載保存的工做，但被要下載全庫這個缺點抵消了，對於依賴管理，我以爲他真沒作多少事。

npm：我是不管前端後端甚至 css 都用 npm 的，公司裏也用 @蘇千 和 @死馬 的 cnpm.org 搭了一個私有庫在用，我的以爲這個工具必定得掌握好，否則你就自絕於當今前端開發的主流了。

 

 

 

前端框架：分具體使用場景：（1）內部管理系統extjs、Angular、React etc.咱們鼓勵在內部或者重要程度比較低的項目中，使用一些新的、熱的或者前沿的技術；（2）移動Web，基礎庫zepto。PC Web，基礎庫jQuery；（3）小項目、活動頁面，一般沒有架構而言。大型項目，基本除了基礎庫，都會有個本身的業務框架；固然咱們也有有些公用組件的沉澱；（4）複雜的PC Web APP中，使用knockout作MVVM和knockout模塊組織代碼；knockout這東西好啊，大小合適，兼容性好，還支持組件化開發；質量保障：項目比較雜，暫時沒有引入專業測試工具，主要是3點：（1）本身編寫的小的測試模塊，作成工做流中的一部分，構建時就能發現一些低級錯誤（相似JSLINT）；（2）JS代碼執行錯誤、AJAX質量、PVUV等的數據上報和統計；（3）運維側的各類監控工具；先後端分離：God Bless，咱們大多數項目都是非展現型頁面。對首頁加載速度沒有過多要求，因此咱們一般都是先後端徹底分離，即所有使用AJAX交換數據，即便是首屏。