node的可能的屬性:語言(與javascript完全一樣,後臺語言),平臺,環境。
-------------------------------------------------------------------
npm:在win下的nodejs下載包裏會像全家桶一樣一起打包進去;在ubuntu命令行下載nodejs的時候可能不包含npm,需要獨立單獨的下載。
npm === node package management
它存在的主要的目的就是處理好依賴關係(這點在linux中能夠直觀的顯示出來)。在ubuntu中,它有點類似於tasksel。
---------------------------------------------------------------------------------------
babel 的CDN的各種版本:
https://www.bootcdn.cn/babel-core/
babel,歷史上的ES6的polyfill(填充)工具,用於之前的在瀏覽器沒有大規模支持es6的編譯工具。
雖然有CDN,但是還是推薦使用NPM下載(多去官網看看)。這裏通過下載babel配置package.json等操作,進一步的瞭解的npm。
通過npm下載babel的命令行操作:
1.npm init: 從外觀和形式上看,只是創建了package.json。但是package.json太重要,它包括了項目的一些基本信息以及一些依賴關係。並且可以通過package.json快速恢復項目/項目中涉及到的依賴關係。
2.npm install --save-dev @babel/core @babel/cli : 通過npm下載babel,同時在對應的文件夾會出現文件夾node_moudules
3.npm install/npm i :當刪除掉node_moudules的時候,可以快速恢復node_moudules以及寫在package.json中的文件依賴關係(嘗試了幾次,雖然確實能下載東西,但下載的東西有點奇怪,最後編譯npm run build也得不到想要的結果。不知何故?後期有相關資料想明白了再更新)。
關於package.json
1.在scripts(這裏的"scripts"是腳本的意思)處配置快速寫法(命令行的簡寫模式).通過在script處添加 {"命令行的簡寫格式":"命令行的原來的格式"}這種格式,達到命令行的簡寫的目的。比如 原先需要在命令行輸入:node server.js -port=80 -s -0 a.log,當在scripts中輸入{"start":"node server.js -port=80 -s -0 a.log"},則原先的需要輸入一大段的命令行可以簡寫爲npm run start(注意start在scripts中的對應關係)。
2.具體而言,scripts處添加“scripts": { "build": "babel src -d lib" }的意義:將 babel src -d lib簡寫爲npm run build。再進一步解釋 babel src -d lib的意義:將src文件夾中的文件編譯(-d)到lib文件夾中。
關於.babelrc
進行到這一步,如果沒出什麼差錯的話,只是把src中的文件整理了一下代碼(代碼對齊什麼的),放到lib文件夾中,並沒有真正的編譯。還需要最後一步,添加配置文件.babelrc,並且在文件內寫上:
{
"presets": ["@babel/preset-env"]
}
與此同時,還需要下載前置環境(preset-env),官方原文摘抄如下:
To start, you can use the env preset, which enables transforms for ES2015+
npm install @babel/preset-env --save-dev
當沒有下載env preset的時候,ubunt環境下出現如下錯誤:
Error: Cannot find module '@babel/preset-env' from '/host/js_html_css/quanzhan_development/babel'
解決方法:https://www.jianshu.com/p/74cb6203c39f。【後發現出現這個錯誤的具體原因是因爲還缺少東西,命令行下載如下:npm install @babel/preset-env --save-dev,可解決這個問題。見上述補充preset-env】
最後總結一下使用babel的流程:
npm init==>npm install -D babel==>修改package.json創建簡寫(此步可以省略)==>下載preset-env:
npm install @babel/preset-env --save-dev==>添加.babelrc文件,並在其內寫上相應的代碼-->npm run build;
一些注意點:
1.node_moudules是不能複製到其他的項目中的,否則會出大問題。因此,每建設一個項目,都需要npm init一下,創建自己的node_moudules.
2.接上面所述的第一點,一定要搞清楚npm init的用途,搞清楚項目文件將要放置的位置,不能直接在命令行裏敲擊npm install --save-dev @babel/core @babel/cli。在選擇好目標文件夾的目標位置的時候,有2種方法(ubuntu爲例),一種通過命令行的cd命令不斷的操作到所需要的位置,一種可以在目標文件夾的目標位置右擊終端直接跳轉(第二種老版本ubunt好像不行?)。
3.babel src -d lib或npm run build編譯的是標準的js文件格式,不能是html等文件格式。
-------------------------------------------