Vue模組化開發 ES6模組化的匯入與匯出

常用的模組化規範：

commonjs、amd、cmd、也有es6的modules

模組化的核心：匯出和匯入

採用匿名函式的形式，在每乙個js檔案中，都封裝乙個匿名函式，並在其內部定義乙個物件，將裡面的內容匯出，方便其他檔案復用

//匯出

;var modulea =
(function()
;var name =
"小明"
;var age =
"20"
; obj.name = name;
obj.age = age;
return obj;})
()// 匯入;(
function()
)()

module.exports=

var

=require
('匯出檔案的位址'
)

1.export的基本使用（匯出方式一） 統一匯出

export匯出：

var name =

"小明"
;var age =
"20"
;function
sum(num1,num2)
export
// 匯出

import

from
"匯出檔案的位址"
console.
log(name)
;

export

var num1 =
1000
;

// 匯出函式

export
function
sum(num1,num2)
// 匯出類
export
class
person
}// 匯入類
import
from
"匯出檔案的位址"
constp=
newperson()
;p.run()
;

某些時候，乙個模組包含某個功能，我們並不希望給這個功能命名，而是讓匯入者可以自己來命名，這個時候就可以用export default

//匯出

var address =
"北京市"
;export
default address;
//匯入
import addr from
"匯出檔案的位址"
//匯出函式
export
default
function
(value)
//匯出函式
import addr from
"匯出檔案的位址"
console.log（addr）;
//此時返回乙個函式，addr就代表default後面的函式
addr
('你好啊');
// 此時返回『你好啊』

模組化開發 ES6模組化開發

ecma組織參考了眾多社群模組化標準，終於在2015年，隨著es6發布了官方的模組化標準，後成為es6模組化 es6模組化具有以下的特點 使用依賴預宣告的方式匯入模組 依賴延遲宣告 優點 某些時候可以提高效率 缺點 無法在一開始確定模組依賴關係 比較模糊 依賴預宣告 優點 在一開始可以確定模組依賴關...

Vue 模組化開發

隨著ajax非同步請求的出現，慢慢形成了前後端的分離 function 常見的模組化規範 commonjs amd cmd，也有es6的modules modul.exports demo a,b commonjs的匯入 commonjs模組 let require modulea 等同於 let ...

Vue模組化開發

是前端分離後 執行所需要的環境 內建了npm 包管理工具 後端之於m en 2.配置國內映象 npm config set registry 3.npm install webpack g 全域性安裝webpack 4.npm insatall g vue cli init 全域性安裝vue腳手架 ...