RubyMine編輯器中安裝CoffeeScript和CoffeeScriptRedux

本文主要講解在RubyMine編輯器中安裝CoffeeScript和CoffeeScriptRedux。

1、確定本地的目標(biāo)安裝目錄，在該目錄下創(chuàng)建“CoffeeScript”和“CoffeeScriptRedux”文件夾。

2、打開命令窗口，通過命令進(jìn)入CoffeeScript文件夾，作為當(dāng)前路徑。

3、輸入并運(yùn)行命令：npm install coffee-script，開始下載安裝CoffeScript，直到完成。

通過命令進(jìn)入CoffeeScriptRedux文件夾，作為當(dāng)前路徑。

4、輸入并運(yùn)行命令：npm install coffee-script-redux，開始下載安裝CoffeScriptRedux，直到完成,如果有警告或者關(guān)于git的錯(cuò)誤，可以忽略。

5、安裝和配置File Watcher Plugin，使其和CoffeeScript、CoffeeScriptRedux關(guān)聯(lián)。

選擇RubyMinde的菜單“File->Settings...”。

在打開的“Settings”對(duì)話框中左側(cè)的列表中，選中“IDE Settings”下的“Plugins”項(xiàng)。

選擇“Browse repositories...”按鈕。

在彈出的“Browse repositories”對(duì)話框中右鍵選擇“File Watchers”，在右鍵菜單中選擇“Download and Install”，關(guān)閉當(dāng)前對(duì)話框。

回到“Settings”對(duì)話框，安裝后，會(huì)在"Plugins"列表中顯示“File Watchers”，安裝完成。

選擇右下角的“ok”按鈕，會(huì)出現(xiàn)是否重啟RubyMine以激活新的Plugin，直接點(diǎn)“Restart”重啟。

重啟RubyMine之后，再次打開Settings對(duì)話框。

6、選中左側(cè)列表中“Project Settings”下新出現(xiàn)的“File Watcher”。

選擇對(duì)話框最右側(cè)的“+”，在菜單中選擇“CoffeeScript”。

7、在“New Watcher”對(duì)話框中，只要設(shè)置“Program”項(xiàng)，該項(xiàng)的值是上面第三步中安裝CoffeeScript后產(chǎn)生的Coffee.cmd的路徑。

路徑：<安裝目標(biāo)路徑>\SoffeeScript\node_modules\.bin\coffee.cmd。

選擇OK。

回到“File Watchers”列表，會(huì)看到有一選中項(xiàng)“CoffeeScript”。

接著，再點(diǎn)最右側(cè)的“+”，這次在菜單中選擇“CoffeeScript Source Map”。

同樣，在“New Watcher”對(duì)話框中，只要設(shè)置“Program”項(xiàng)，該項(xiàng)的值是上面第三步中安裝coffee-script-redux后產(chǎn)生的Coffee.cmd的路徑。

路徑：<安裝目標(biāo)路徑>\CoffeeScriptRedux\node_modules\.bin\coffee.cmd。

選擇OK。

回到“File Watchers”列表，會(huì)看到兩個(gè)選中項(xiàng)“CoffeeScript”和“CoffeeScript Source Map”。

關(guān)聯(lián)設(shè)置完成，點(diǎn)“ok”，結(jié)束。

7、安裝和配置Node.js Plugin。

參照上面第4步的開頭，打開“Settings”對(duì)話框，選中“Plugins->Browse repositories...”。

找到“NodeJS”，右鍵，選“Download and Install”后，回到“Plugins”，等待安裝完成后，選“OK”，并按照提示重啟RubyMine。

重啟后，選擇工具欄上的NodeJS圖標(biāo)。

在“Node.js”對(duì)話框中，點(diǎn)“Configure”按鈕。

按照下圖進(jìn)行設(shè)置后，點(diǎn)“Configure”按鈕，完成設(shè)置。

8、寫一個(gè)最基本的。

按照下圖，在C1.coffee源文件中寫一個(gè)能夠返回給網(wǎng)頁“hello world”的web服務(wù)。

注意：一旦修改了C1.coffee代碼，就會(huì)生成其對(duì)應(yīng)的js文件，用這個(gè)js文件作為執(zhí)行對(duì)象即可。

9、選擇菜單“Run->Edit Configurations...”。

如下圖一樣，以對(duì)應(yīng)的js文件作為對(duì)象后，點(diǎn)“OK”。

然后，選擇工具欄上的執(zhí)行按鈕。

正確執(zhí)行后，打開瀏覽器，在地址欄中輸入：http://localhost:8888/。

就能看到顯示“hello world”的簡單頁面了。

至此構(gòu)筑工作完成。

RubyMine的功能超強(qiáng)，不僅限于此，比如還能支持Debug等等等等。。。^-^

RubyMine編輯器見上文：http://m.elephantinaurance.com/html/20307_1.html