前端工具安裝

發表於 2016-01-30 更新於 2024-04-15 分類於工具閱讀次數： Disqus：

因為真的很不常用，所以我肯定會忘記，整理前端工具的安裝方式，純粹記錄用來備查。免得曾經記得學過這些東西然後到最後都是忘光光。透過套件管理工具 Chocolatey 安裝 Git、NodeJs、Python，再透過 NPM 安裝 bower、gulp、yeoman、webpack 等前端自動化工具。至於使用方法嘛….科科….

套件管理工具 Chocolatey

透過套件管理工具來安裝前端開發會用到的東西，可以省掉你找檔案的麻煩，我是覺得還不錯啦。官方網站傳送門：Chocolatey

我找了好久都找不到頁面上的 Download 按鈕，最後才發現網站上很貼心的直接提供了安裝的指令，應該就是英文不好大腦直接會略過的下意識反應吧

使用系統管理者身分開啟命令提示字元視窗，輸入下列指令就可以自動安裝了

1	@powershell -NoProfile -ExecutionPolicy Bypass -Command "iex ((new-object net.webclient).DownloadString('https://chocolatey.org/install.ps1'))" && SET PATH=%PATH%;%ALLUSERSPROFILE%\chocolatey\bin

安裝完成之後可以輸入 choco/?看看 help 文件，直接輸入 choco 也可以查看版本

安裝 Git

1	choco install git

安裝過程會問你是否同意執行 script 等等的，如果不同意就不會安裝，當然也可以給參數-y 略過詢問，安裝完成之後也會在畫面上提示你安裝的 LOG 檔案放置在哪裡。

安裝完畢 Git 後其實就可以安裝 cmder mini 版這個替代命令提示字元的小工具，詳情可以參考保哥的文章，我也不可能說得更詳細了，傳送門：介紹好用工具：Cmder ( 具有 Linux 溫度的 Windows 命令提示字元工具 )

安裝 NodeJs

1	choco install nodejs

安裝時的提問習慣性將將程序中斷，想要輸入-y 略過詢問試試，結果 Ctrl+C 中斷之後再次安裝告訴我已經安裝過了，choco 很貼心地告訴我可以試一下強制安裝–force，再次安裝就成功了。

安裝 Python2

1	choco install python2

沒意外，很順利地安裝完成。

套件管理器：npm、bower

網站骨架產生：yeoman

前端工作流程自動化工具：gulp

前端模組與相依性自動解析工具：webpack

瀏覽器同步瀏覽工具：browsersync

安裝上面一堆東西直接透過 nodejs 的套件管理工具 npm 來做

1	npm install -g bower gulp yo webpack browser-sync

參數-g 代表安裝在全域模組，後面的就是套件的英文了，用空格隔開可以一次安裝很多個

要看有安裝那些 npm 的全域模組可以透過指令來查看

1	npm list -g --dept=0