資訊專欄INFORMATION COLUMN
摘要：安裝成功的驗證方式中輸入如果輸出版本號就說明沒有問題。這里再提一點，因為國內的某些原因，通過安裝工具可能會非常慢，這里需要我們做一點修改，也就是使用淘寶鏡像。
最近看視頻學習了前端自動化的一些知識，確實讓我大開眼界。感覺前端越來越神器了。同時跟著視頻自己也嘗試運用了一些工具去構建前端項目，但是中間遇見了很多坑，磕磕絆絆的才實現了一點功能，所以打算記錄一下學習過程中的筆記。
首先列舉一下關鍵詞：NodeJS、Git、Yeoman、bower、Grunt。 其中NodeJS作為核心，在它的基礎上我們可以利用Yeoman、bower、Grunt這三個前端工具實現前端自動化，而Git，主要是用它自帶的 Git Bash命令行。為啥要用Git自帶的命令行呢，這我就得吐槽一下了：網上的視頻、博客、資料、翻譯等等上面出現的有關Yeoman，Grunt這樣的例 子都特么是用Mac OS X 下面實現的，我一個窮屌絲用windows系統的CMD跟著跟著就出問題了，換不了硬件設備，所以只能先用軟件彌補。。
下面進入主題：
第一步：下載Node并安裝。傳送門：Node官網，去上面下載適合你系統的版本，然后安裝就OK。安裝成功的驗證方式 ：cmd 中輸入 node -v ,如果輸出node版本號就說明沒有問題。
第二步：安裝Git。傳送門：下載Git ,去上面下載適合你系統的版本，然后安裝。安裝教程百度即可，但是需要注意一點，執行窗口還是要選擇windows自帶的比較好
也就是最后一步配置要選擇 下面的選項。
這樣做只是為了以后使用方便一點。具體方便在哪里，不告訴你們，你們自己去試。。。。
安裝好Git 之后，桌面或者任意文件夾內點擊鼠標右鍵就會看到 Git Bash here,這樣的選項，點擊后就可以看到我們最主要的工具了。接下來就是安裝Yeoman、bower、Grunt這三個工具了。
這里再提一點，因為國內的某些原因，通過node安裝工具可能會非常慢，這里需要我們做一點修改，也就是使用淘寶npm鏡像。具體方法如下：
1.命令窗口（上面提到的Git Bash here ）執行：npm config set registry https://registry.npm.taobao.org
2繼續執行命令驗證：npm info underscore （如果上面配置正確這個命令會有字符串response）
切換淘寶鏡像的方法還有其他的，感興趣的自行Google/百度。
安裝Yeoman的命令：npm install -g yo
驗證方式： yo -v 或者 yo --version 顯示版本號
安裝bower的命令 ：npm install -g bower
驗證方式： bower -v 顯示版本號
安裝grunt的命令 ：npm install -g grunt-cli
驗證方式： 輸入grunt 會有提示
到這里基本的工具都已經安裝好了。
這里再講一下Yeoman、bower、Grunt分別是干什么的。
Yeoman：我理解它的作用是生成前端項目的整體文件結構。通過Yeoman可以生成一個簡單的但是非常完整的前端項目文件結構，這個生成的項目已經是一個可以運行的Demo,我們可以在這個結構上拓展和改造，實現想要的功能。
bower：它的官網上的解釋是： A package manager for the web，它就是一個依賴包管理工具，通過它我們可以在項目中自動生成我們需要的依賴包例如：JQuery、angular等，不需要再去網上找到它們的文件，下載下來在復制進項目這樣繁瑣的工作。
grunt：grunt的功能就厲害了，它可以對項目中的JS、CSS文件進行壓縮、合并、混淆等等操作，還能實現前端的自動化單元測試，各種牛X的功能，讓我這個前端小菜鳥看的眼花繚亂的。。。
到這里前端自動化的第一步已經邁出去了，接著學著用他們了。
文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。
轉載請注明本文地址：http://m.specialneedsforspecialkids.com/yun/82665.html
摘要：一般前端項目安裝依賴使用。包括，，以及程序主入口文件。然后頁面顯示正常。這樣就實現了使用構建一個項目，并簡單開發了一下，創建一個新的頁面并實現了路由跳轉。 一. 安裝 第一步：安裝npm所需模塊 首先需要安裝Node.js，然后使用npm安裝所需要的模塊 npm install -g grunt-cli bower yo generator-karma generator-angula...
摘要：通過官方的生成器，他們建立了一個的工作流，這個流是由一個強大的固定的客戶端組建，包含工具和框架幫助開發者快速建立牛逼的應用。 原文還是在簡書上： Yeoman-- 一個強大的前端構建工具,我只是自己的搬運工！！ 上期跟大家試了試Vue-cli這個構建工具，這個讓我想起了很多其他的前端工具，其中一個就是Yeoman（上次就劇透了的）,所以這期跟大家先簡單介紹下這個腳手架工具，然后慢慢一步...
摘要：通過官方的生成器，他們建立了一個的工作流，這個流是由一個強大的固定的客戶端組建，包含工具和框架幫助開發者快速建立牛逼的應用。 原文還是在簡書上： Yeoman-- 一個強大的前端構建工具,我只是自己的搬運工！！ 上期跟大家試了試Vue-cli這個構建工具，這個讓我想起了很多其他的前端工具，其中一個就是Yeoman（上次就劇透了的）,所以這期跟大家先簡單介紹下這個腳手架工具，然后慢慢一步...
閱讀 3286·2021-11-18 10:02
閱讀 3450·2021-10-11 10:58
閱讀 3382·2021-09-24 09:47
閱讀 1129·2021-09-22 15:21
閱讀 3952·2021-09-10 11:10
閱讀 3283·2021-09-03 10:28
閱讀 1753·2019-08-30 15:45
閱讀 2147·2019-08-30 14:22
