react作為當前十分流行的前端框架，相信很多前端er都有蠢蠢欲動的學習它的想法。工欲善其事，必先利其器。這篇文章就簡單的給大家介紹一下如何我快速的搭建乙個react前端開發環境。主要針對於react小白，大神不喜勿噴。
從標題可以看出，這裡不會僅僅只介紹一下react的開發環境如何搭建。我將這個系列分成三篇介紹:
接下來就開始介紹如何去開發乙個簡單的react-start腳手架，從而一鍵生成react開發環境。
首先來看一下腳手架的目錄結構，基本結構如下：
-bin
|--reactgenerator
-commander
|--init.js
-config.json
-package.json
從bin/reactgenerator：定義基本的命令
commander/init.js：定義命令所對應的操作
config.json：腳手架的一些配置檔案
package.json：專案的包檔案
package.json檔案中可以看出，專案的基本依賴主要有如下幾個：
"dependencies":命令的基本定義主要是在chalk：給命令列輸出新增顏色
co：執行generator函式
co-prompt：用於命令列互動
commander：定義命令列操作和執行指定的命令
ora：乙個很有趣的命令列loading動畫
reactgenerator中，了解該檔案之前，請確保自己對commander這個庫有基本的了解，不了解的同學請自行前往github。
下面就是reactgenerator的完整內容：
#!/usr/bin/env node
const program = require('commander')
const package = require('../package')
// 定義版本號
program.version(package.version)
// 定義使用的方法
program.usage('')
// 定義腳手架的初始化工作
program
.command('init')
.alias('i')
.description('generator a react project')
.action(() => )
// 解析引數
program.parse(process.ar**)
// 如果沒有輸入命令 顯示幫助的內容
if (!program.args.length)
init操作，當我們全域性安裝腳手架工具的時候，我們就可以通過如下命令建立我們的專案。
react-to-start init 或者 react-to-start ireact-to-start是你在package.json的bin欄位中指定的。
"bin":init命令，這個命令的基本定義如下：
const co = require('co')
const chalk = require('chalk')
const prompt = require('co-prompt')
const ora = require('ora')
const fs = require('fs')
const exec = require('child_process').exec
const config = require('../config.json')
const init = () => does not exit, you can choose one of the template listed below`))
branchesname.foreach((name, index) => . $ \n`))
})process.exit(1)
}let git = ''
fs.exists('./.git', function(exists) $ && cd $ && git checkout $`
} else $ && cd $ && git checkout $`
}// 使用 ora 列印出 loading + log
let spinner = ora(`is downloading the template for $...`)
// 開始 loading 動畫
spinner.start()
exec(git, (error, stdout, stderr) =>
process.stdout.write(chalk.green('\n $$$ generation completed! to use step by step as following: '))
process.stdout.write(chalk.green(`\n 1. cd $ `))
process.stdout.write(chalk.green(`\n 2. npm install \n`))
process.exit(0)
})})
})}module.exports = init
nodejs基礎且了解co的同學都會很輕鬆的讀懂，這裡就不在多述(感冒好難受的說)。
腳手架所對應的模板目錄就是在上篇文章中所講的內容，不了解的同學請戳從react-start到co源(一)如下就是配置檔案：
templateurl就是模板位址(暫存在我的github上)，branchesname就是專案的名稱，在github中以分支表示。 混源的結果就是從開源到閉源的倒退
近日，微軟主辦的 混源與資訊科技互操作高階論壇 在京舉行，捧場的人不少，讚歌也很嘹亮。實際情況是怎樣的呢？10月6日，微軟在youtube上發布了一段3分鐘錄影 video 題目為 a few perspectives on openoffice.org 內容的主題是 openoffice.org使...
Spark1 3從建立到提交 4 資源分配原始碼分析
spark提供了2種資源分配的策略，一種是盡量分散 spreadout，預設 一種是盡量集中，具體看下這個master.schedule方法 原始碼位置555行 val usableworkers workers.toarray.filter state workerstate.alive 可用wo...
從資料到資訊到決策
俗話說，忘記歷史就是背叛自己，今天這篇用此做開場再合適不過。這一篇將根據乙個虛擬的故事，來介紹如何通過歷史資料來幫助乙個銷售人員發現規律資訊從而輔助他來做一些決策資訊。本文的主角是tim，tim在乙個銷售部門，部門最近決定做新一輪銷售計畫，然後根據計畫結束時，各個銷售人員的銷售業績來進行kpi考核。...