標籤:

npm的應用場景,剛需在何處?簡單的寫寫頁面是否需要npm包管理工具?

最近在學習VUE,目前還是菜鳥,看網上視頻教程的時候,老師們都是直接src把vue.js引入然後開擼。但是我在網上下載的UI框架或項目實例什麼的,都是npm走起的,而且最後build的包很大,遠超直接src引人vue.js,都說用npm管理是為了方便管理依賴關係,但我寫的代碼好像沒什麼要依賴的啊,即使有,也是很少的依賴啊,好吧我是小白,思維還停留在jquery階段,還很淺薄。我就想,npm應該是有它的應用場景的,在這個場景下是剛需,如果我只是要做一些簡單的頁面,是不是沒必要npm走起的?什麼時候才是剛需呢?


蟹妖

你要走200米,走路最好。

你要走2公里,騎車最好。

你要走20公里,開車最好。

你要走200公里,火車最好。

你要走2000公里,飛機最好。

複雜的工具是用來解決複雜的問題,大材小用或者小材大用都會覺得彆扭。

當然習慣了開車的人,可能很短的路也會開車,這雖然沒有必要,但是也沒錯。

當你不知道應該選擇 A 還是 B 的時候,根據奧卡姆剃刀原理:如無必要,勿增實體。

說人話就是:挑簡單的那個


其實我覺得Vue最大的一點好就在於,漸進式框架,你可以像jQuery一樣引到頁面里就開始使用最基礎的功能,也可以在項目複雜度達到一定程度後引入更高級的功能,比如單文件組件。

事實上Vue在引入單文件組件之前幾乎可以不使用任何構建工具就能使用到Vue的全部功能,包括Rouer和Vuex。單文件組件解決的問題則是更好的模塊化,比如一個組件的M,V,C都在一個文件中。

而React跟Angular2+在你寫第一行代碼之前基本上就得配置好構建工具。

而構建工具這些對於新手來說門檻確實有點高,因為在你理解構建工具之前,你得先理解node,模塊系統等東西。

npm最大的功能就在於依賴管理,打包則是把從入口文件開始的所有依賴都整到一個文件里並且讓這可以在瀏覽器里運行。

對於新手來說,我不建議把精力太多的放在工具鏈上,而是應該放在技術本身上面,具體來說,能讓代碼跑起來把東西做出來才是最重要的。

以上。


從講師的角度來說,把一大堆東西無關的東西疊加到課程里會極大的分散學生的注意力,降低課程效果。講vue當然要直接引包上來就是干,否則我們這節課到底是在講vue還是在講webpack?

從程序員的角度來講,我不希望見到一個同事,連webpack怎麼配置都懶得學,卻在那裡扯什麼複雜工具無用論。

實在點的回答就是,這位同學如果你連npm、webpack怎麼用都懶得學,怕不是不想找工作了………(逃


你如果用Vue做的話,肯定會需要很多依賴或者其他框架,個人建議用npm管理,並且你現在做的東西比較簡單也可以當作練手,邊學邊用,從簡單開始,以後肯定會用到的,准沒錯


組裝個自行車,你讓自動組裝廠過來幫你組裝,確實費力費錢費時間。

但你要組裝個飛機,沒有自動組裝廠,難道用手組裝飛機?

恐怖的是一個飛機頭(大配件)可能有很多導航儀(中配件),一個導航儀可能有幾百個電子儀器(小配件)。當你要飛機頭的時候,誰來管理你這些依賴關係呢?

還是一句話,殺雞不能用牛刀,但殺牛用把水果刀也不合適吧!

------------回到正文回答---------

直接用vue.js擼,那是因為他們不需要用代碼檢查,不需要自動打包。只要給你演示就好了,又不是開發複雜項目,搞的這麼複雜幹嘛。


用npm可以把所需要庫的下載和更新都寫成一個批處理文件

雙擊一個批處理文件怎麼也比去網站下載快吧

時不時雙擊一下更新的批處理文件,也比直接去官網看最新的版本號方便


包管理工具,用於管理業務庫依賴。

比如說你要依賴(使用)JQuery,然後在頁面尾部手動寫了一行CDN或者項目庫路徑,但是有一天你要升級高版本或者需要降級jq,需要手動改寫這一行路徑,如果是jq在本地,還需要手動把依賴下載替換…注意「手動」這個詞。

那麼這只是一個依賴庫,如果有多個的話,像vue裡面還需要Babel進行ES6轉碼,ajax用的vue-resource或者axios,如果不用npm,那麼你只能手動管理…

這還只是一部分,如果一個依賴還依賴別的包,比如Babel還依賴其preset的庫,如果項目複雜,依賴套著依賴,作為程序員你要一點一點的手動查找依賴關係然後引入項目,如果項目變動還需要一行一行的改么…

這就是NPM的作用,如果你沒用到,說明你的項目還很輕。


我覺得 @王德福 老師說的很好的,這裡涉及到工具的複雜性和問題的複雜性匹配的問題。不過你用慣npm以後,稍微複雜的問題和簡單的問題都可以解決,提高生產效率,為啥要用npm呢?如果你引入十個庫,只需敲打十行命令和添加十行代碼就行了。不過,一個庫那是沒啥區別。

I think teacher WangDeFu"s gets a point. what"s involved here is instruments complex should adpot to problems complex. But when you get used to npm, you can both solve a bit of complex and simple problems. It does enhance developing efficiency. Why do we need npm? If you add 10 libraries, the only thing you need to do is typing 10 commands and adding 10 codes. However, there is no difference for one library.

令外我不知道npm是不是解決了依賴關係的,但是webpack確實是解決的,當同時引入兩個庫文件,先引入庫a,再引入庫b。而庫a中某個變數α是庫b中定義的,而由於js是按順序來全局執行的特性。先執行的a就找不到α變數,webpack的import注入庫,再進行打包就不會出現這個問題。因為webpack會生成依賴關係圖,根據圖打包。

anyway, I don"t know whether npm is to solve the dependency problem. But the webpack does solve it. when we inject two libraries, first, we inject library A, then, library B. However, there is a variable α which is defined by library b. In this case, when js files are executed in order, a file won"t find α. That causes a problem. webpack uses import statement to inject library. It will create a dependency graph to nail it.


沒必要 比如一個內聯的JS代碼的頁面原聲就好 只有到了工程化 多人協作 才需要這些


推薦閱讀:

npm install 生成的package-lock.json是什麼文件?有什麼用?
為什麼 npm 要為每個項目單獨安裝一遍 node_modules?

TAG:npm | Vuejs |