mobile1

1　　.咱們傳統的網頁開發，整個網頁咱們寫一個js文件，全部的特效都寫在裏面了，有不少的缺點：耦合度過高，              代碼關聯性太強，不便於後期維護，會形成全局污染。

例如：這樣

     

       發生的強求次數過多，依賴模糊，難於維護

       這些都是傳統的開發形式，都被拋棄了

2.　　因此咱們須要用模塊化開發

　　　模塊化的開發有不少的優勢，能夠減小代碼之間的關聯度，部署方便，更好的分離   按須要加載，避免命名衝突，容易維護。

3.　　那麼什麼是模塊化開發呢？

　　模塊化就是將js文件按照功能分離，根據需求引入不一樣文件中。源於服務器端。

因此咱們就運用到了node.js,在node.js中，模塊就是一個文件，一般js，json文件，包是多個模塊的集合，相似文件夾

　　node自帶的規範是commonjs規範

　　commonjs是node的規範，運行在服務器端，不是瀏覽器端，若是使用在瀏覽器端，須要使用對該文件進行打包編譯(借鑑工具 browserify，webpack，gulp等)

　　咱們書寫模塊時，爲了使一個屬性在另外一個文件中也可使用，就須要將一些屬性進行暴露，咱們能夠用這兩種方法  

　　　　　　module.exports={}  

　　　　　　exports.xxx=xxx

注：兩者暴露的本質是相同的，都是報錄一個exports對象，不一樣的是第一個，若是後面再附一個對象的話就會覆蓋前面的，而第二個是在exports賦值

　　而後咱們在另外一個模塊用接口引入暴露接口的文件，是用require（路徑）

　　commonjs暴露的本質是同樣的，都是暴露一個exports對象

　　commonjs是node的規範，但他是同步加載的，同步加載在瀏覽器端是一個坑，只要一個環節卡住了，後面就無法執行。因此不建議使用，若是非要使用就須要編輯打包。

　　在web端

　　每一個js都是一個模塊，每一個模塊都必須有一個暴露接口，每一個js文件有一個全局的方法叫require()用於引入模塊。

　　接下來是模塊

　　　　1.node自帶的模塊(包)       path url fs

　　　　2.第三方模塊　　weui      zepto    jqury    axios

　　　　npm   全名  node    packsge        manager       node包管理工具  可進行    增刪查改

　　　　詳細使用方法見                          

https://www.npmjs.com/

　　　　若是npm操做太慢

　　　　可安裝npm鏡像

npm install -g cnpm --registry=https://registry.npm.taobao.org            (在npm中輸入此條語句)

　　　　　　下載     

　　npm  install  jquery     

　　載存放的位置

　　　全局下載       在任何一個文件下均可以使用這個包，全局安裝目錄

　　　　　　C:\Users\Administrator\AppData\Roaming\npm\node_modules

　　如何全局安裝

　　npm install  -g jquery

　　　局部安裝
　　npm install  jquery

　　就會在目錄下生成一個node_modules的文件夾裏面

　　npm install jquery   --save

　　這個是下載運行環境(生產環境)的包      好比jquery

　　

　　npm install jquery --save  -dev

　　這個是下載開發環境因此來的包      好比 npm    browserify

　　

　　兩者區別

　　前者--save是上線是會被壓縮的包，後者--save -dev是上線時會被拋棄的包

 

若是須要下載指定的版本         以jquery爲例

npm   install   jquery@3.2.1   --save

　　npm install    要下載的文件名@版本號       --save

npm刪除    npm     uninstall     jquery

npm查版本       npm   search       jquery

npm更新        npm     updata      jquery

　　　　三、自定義更新       咱們寫的

　　　　　　1.配置模塊說明文件     npm  init     就會生成一個package.json的文件

　　　　　　

　　　main:index.js咱們的主文件是index.js

　　　index.js是這個包的輸出文件，即便刪除了 package.json只要不改變index.js的文件名就沒事，一旦改了機會報錯，是由於包的輸出文件默認是index.js

　　　　　2.。var obj=require("cui")

　　　　　　默認在node_modules文件夾下照這個包

　　　　　　在瀏覽器端，說require is not  defined   說明瀏覽器 不支持  commonjs，須要借鑑打包工具 

 　　　　　　　　<1>下載打包工具  

　　　　　　　　　　browserify      npm  i      browserify  -g

　　　　　　　　<2> 編譯打包

　　　　　　　　　node  

　　　　　　　　　　node是javascrip的環境，在 node裏面能夠運行js文件。  指令   node      文件名