背景

去年不是降本增“笑”，“裁員”廣進(jìn)來著嗎，公司有個(gè)項(xiàng)目因此停止了，最近又說這個(gè)項(xiàng)目還是很有必要的，就又重新啟動(dòng)這個(gè)項(xiàng)目了，然后讓我這個(gè)“大聰明”把環(huán)境重新跑起來。讓我無(wú)奈的是，原項(xiàng)目的團(tuán)隊(duì)成員都已經(jīng)被增“笑”了，只留下了一堆不知從哪開始著手的文檔。

后端還好，前端我心里就犯嘀咕了，畢竟已經(jīng)5年沒有關(guān)注過前端了，上次寫前端代碼用的還是一個(gè)基于Angular構(gòu)建的移動(dòng)框架inoic，不知道大家用過沒有。

好在這個(gè)項(xiàng)目前端也用的Angular框架，本以為整個(gè)過程會(huì)很順利，然而，結(jié)果總是事與愿違。果不其然，在搭建前端開發(fā)環(huán)境時(shí)就給我上了一課，整個(gè)過程讓我抓耳撓腮，遂特此記錄。

環(huán)境搭建心路歷程

跟著文檔操作

前端文檔中對(duì)環(huán)境搭建有進(jìn)行說明，一共有4個(gè)步驟，大概是這樣的：

1. 確認(rèn)node環(huán)境，需要某個(gè)及以上版本。

2. 安裝@angular/cli。

3. 安裝依賴。

4. 啟動(dòng)項(xiàng)目。

看到這里，我第一反應(yīng)是“??？現(xiàn)在前端這么麻煩的嗎？”，我記得以前在瀏覽器直接打開頁(yè)面就可以訪問了。咱也不懂，跟著說明操作就行。

1. 我本地不知道啥時(shí)候裝了nodejs，執(zhí)行node -v后輸出v18.13.0，符合要求。ok

2. @angular/cli這是啥，咋也不懂，執(zhí)行安裝命令就行，輸出看上去是沒有問題。ok

3. 安裝依賴我理解跟Maven的依賴管理一樣，先不管，執(zhí)行。ok

4. 到這一步，我覺得應(yīng)該可以順利啟動(dòng)，看一看這個(gè)項(xiàng)目的廬山真面目了，結(jié)果執(zhí)行 npm start 后報(bào)下面這個(gè)錯(cuò)。

出現(xiàn)問題一：nodeJS版本過高

百度一看，原因是node 17版本之后，OpenSSL3.0對(duì)算法和密鑰大小增加了嚴(yán)格的限制。

解決唄，降版本唄，node官網(wǎng) 下載了v14.12.0。

出現(xiàn)問題二：nodeJS版本低于Angular CLI版本

降版本之后重新運(yùn)行npm start，您猜猜怎么著

很明顯，新老版本沖突了，又是版本問題，又是一頓百度之后，發(fā)現(xiàn)知乎上的一個(gè)帖子跟我這問題現(xiàn)象是一樣的：“node是最新版，npm啟動(dòng)項(xiàng)目使用的不是最新版的node，請(qǐng)問這個(gè)怎么解決？”

跟著下面的評(píng)論又安裝了nvm（Node Version Manager），最后一頓操作后，莫名其妙的啟動(dòng)了。

事后才反應(yīng)過來，這個(gè)問題的根本原因是：Angular CLI是在node版本為18.3時(shí)安裝的，版本更新到14.12.0后需要?jiǎng)h除依賴重新安裝。

$\color{blue}{但是我不確定的是對(duì)應(yīng)的npm版本會(huì)不會(huì)一同更新，有知道的小伙伴評(píng)論區(qū)交流一下。}$但是我不確定的是對(duì)應(yīng)的npm版本會(huì)不會(huì)一同更新，有知道的小伙伴評(píng)論區(qū)交流一下。

不過nvm確實(shí)好用，至少不用擔(dān)心node和npm版本問題，比如下面的命令：

學(xué)到的第一個(gè)知識(shí)：nvm

這里記錄下nvm安裝過程

1. clone this repo in the root of your user profile

• cd ~/ from anywhere then git clone github.com/nvm-sh/nvm.… .nvm

2. cd ~/.nvm and check out the latest version with git checkout v0.39.7

3. activate nvm by sourcing it from your shell: . ./nvm.sh

配置環(huán)境變量

引發(fā)的思考

技術(shù)發(fā)展日新月異

早在幾年前，程序員是要前后端一起開發(fā)的，不分什么前后端，我從最開始的HTML、JavaScript開始用到AngularJS這些框架，印象最深刻的是還要解決兼容IE瀏覽器。沒想到現(xiàn)在的前端也會(huì)有版本管理、組件化等等，可見技術(shù)更新迭代速度之快。

前端的重要性

當(dāng)初在選擇后端的時(shí)候認(rèn)為前端技術(shù)無(wú)非就那些，沒有什么挑戰(zhàn)。事實(shí)上，前后端沒有分離之前，市場(chǎng)上的應(yīng)用頁(yè)面也是極其簡(jiǎn)潔的，前后端一起兼顧是沒有精力寫出那么好看的界面和交互的。所以“前端已死”的觀點(diǎn)我是不認(rèn)可的。

降本增“笑”被迫全棧

前幾天參加了開發(fā)者社區(qū)的線下聚會(huì)，聊了一下行情。有小伙伴吐槽，因?yàn)樵诮当驹觥靶Α钡脑?，現(xiàn)在他們被公司要求要寫前端，被迫向全棧發(fā)展，竟意外發(fā)現(xiàn)開發(fā)效率極其高。還有小伙伴說“前端被裁的剩下幾個(gè)人，一個(gè)前端對(duì)接十個(gè)后端。”。是呀，在降本增“笑”之后，老板恨不得讓一個(gè)人干十個(gè)人的活。

與時(shí)俱進(jìn)

不論是幾年前的前后端分離還是降本增“笑”帶來的被迫全棧，還是最近“前端已死”的觀點(diǎn)，一切都是行業(yè)發(fā)展所需要的。我們需要做到的是：不斷學(xué)習(xí)和更新自己的知識(shí)和技能，以適應(yīng)行業(yè)的發(fā)展和變化。

作者：王二蛋呀
鏈接：https://juejin.cn/post/7327599804325052431
來源：稀土掘金
著作權(quán)歸作者所有。商業(yè)轉(zhuǎn)載請(qǐng)聯(lián)系作者獲得授權(quán)，非商業(yè)轉(zhuǎn)載請(qǐng)注明出處。