⑴ 前端入職需要安裝什麼環境
一、基礎環境
Node.js是JavaScript運行時，目前前端工程化必不可缺的一個環境。通常我們會選擇穩定版本(LTS)進行下載。
NPM是javascript的包管理工具，也是目前Node.js默認的包管理工具。一般下載了Node.js後會附帶npm，不用專門的去下載。
YARN是Fackbook開源的依賴管理包，和npm是做同樣的工作，但相比npm安裝依賴的速度會更加迅速。兩者都是講依賴寫入package.json中，在使用習慣上是相近的。
Git是最先進的代碼版本控制軟體。
二、開發環境
編輯器
目前前端開發主流的編輯器有sublimeText、WebStorm、vscode，三種主流器各有特點:
sublimeText是一個十分輕巧的編輯器，編輯器是付費軟體，可以無限試用。在 macOS 上下載該軟體僅需 15.2MB. 需要安裝相應的插件，比如你可能需要某個語言的語法高亮，因此你需要在 store 上找到相應插件來提高你開發體驗。
webStorm是一個功能強大的編輯器，同時也是一個付費軟體，並不像sublimeText那樣可以無限試用，由於功能太過於齊全，一些低配置的電腦可能會吃不消。以上特點是群友對webStorm的評價，筆者沒有使用該編輯器，不過多評論。
vsocde是由微軟開源的一個編輯器，雖然是後起之秀，但開源後該編輯器的設計與體驗迅速吸引了一大批用戶。它內置了一些前端基礎的開發環境，針對Node.js還可以進行短點調試。
vscode其中有一個插件叫做setiings sync, 它可以將你的編輯器配置上傳至gist。就算你換了一個全新的設備，下載vscode後，再下載該插件，傳入Token後就可以同步你所有的配置，十分的方便~
vscode的配置可以查看具體教程
瀏覽器
前端的工作更多時候是與用戶打交道，我們的工作產出通常在瀏覽器頁面上呈現。
瀏覽器通常提供了開發者工具以供開發者調試，目前市面上主流的瀏覽器主要就是chrome、Safari、IE/Edge、opera、firefox這五種瀏覽器。國內市場有UC瀏覽器等，但內核的大多都是採用webkit或者兼容低版本IE內核。
從statcounter 統計數據來看，目前主要的趨勢還是以chrome所使用的webkit內核作為主流，同時chrome的開發者工具對於開發人員十分的友好，因此有很多的開發者選擇了該瀏覽器作為首選的調試工具。chrome還有一個便利就是登陸了谷歌賬號後，可以在別的機器上進行同步插件和配置。
⑵ 前端絕不依賴於介面嗎
前端有很多方面的項目，有些是不依賴介面的，但是有些是需要依賴介面的。
不能說絕不依賴，前後端更多的是互相配合，介面可以前端來定，也可以後端定，沒有介面之前前端可以mock數據。
⑶ 前端環境的安裝與配置
前端環境的安裝與配置？一、工具安裝
1.編輯器
2.Git(分布式的代碼管理工具)
3.Photoshop
4.Nodejs鏈接
二、 環境配置
1.配置git：
1.1 設置Git的user name和email：
$ git config --global user.name "name"
$ git config --global user.email "[email protected]"
1.2 生成SSH密鑰過程：(看需求配置)
$ ssh-keygen -t rsa -C "[email protected]"
3個回車，密碼為空。
Your identification has been saved in /home/tekkub/.ssh/id_rsa.
Your public key has been saved in /home/tekkub/.ssh/id_rsa.pub.
The key fingerprint is:
………………
最後得到了兩個文件：id_rsa和id_rsa.pub
添加密鑰到ssh：
登陸gitlab, Profile Settings -> SSH Keys -> ADD SSH KEYS ,找到本地的id_rsa.pub文件，復制出裡面的內容，添加到 key 內，此時 Title 會自動填上你的郵箱，沒有的話手動填寫, ADD KEY
1.3 拉取代碼到本地(許可權)
創建一個存放項目的文件夾，在該文件夾下，單擊右鍵，選擇git bash,打開git命令框，編寫命令：git clone [email protected]:xx/xx.git（可以在gitlab項目中找到存放地址，gitlab地址：http://gitlab.vchangyi.com ），按回車，就可以從gitlab上clone代碼到本地文件夾
1.4 手動安裝nodejs，如果是pc端安裝的話，nodejs版本不能過低。
安裝最新版的話npm安裝項目依賴會有問題，手機端gulp無法啟動，所以建議安裝nodejs V6。
1.5 測試node是否安裝成功
在git 命令窗或者node 命令窗中輸入命令 ：node -v
1.6 同理，測試npm是否安裝成功npm -v
1.7安裝gulp
在項目下打開git 命令窗，從淘寶源上自行安裝，這個時間需要等待和耐心，也會有網路原因導致安裝失敗，如果安裝失敗可以多來幾次，直到成功為止。
如果是pc端：npm install --registry=http://registry.npm.taobao.org --phantomjs_cdnurl=http://cnpmjs.org/downloads
npm 安裝時候 持久使用淘寶源 設置:
npm config set registry https://registry.npm.taobao.org
配置後可通過下面方式來驗證是否成功
npm config get registry
或
npm info express
⑷ Webpack前端項目打包配置
1、安裝依賴包
初始化項目為nodejs項目
另一種是在html中通過img標簽的src引入，因為webpack對html支持不友好，所以需要藉助插件html-webpack-plugin
第三種是借用拷貝插件，直接強行拷貝所有圖片，因為本項目圖片是在xslt中引用，所以採用第三種和第一種結合的方式處理圖片，在plugin參數中添加
如果css是與其餘的css一起打包，那麼其中對fonts資源的引用路徑也會自動發生變化，一定注意，是個大坑！！
⑸ 前端工程依賴包的分類
關於 npm 包依賴，分三種情況 :