在vue裡面能夠使用import命令,並且可以透過Node.js起本地伺服器而不會報錯的原因是在於vue使用babel對ES6的模組系統進行了編譯,將其轉換為CommonJS規範了
目前最新版本的Node仍然以CommonJS作為模組規範,所以要使用ES6模組系統暫時還是需要babel的
另外,CommonJS和ES6的模組系統主要存在以下區別
如有兩個檔案,a.js和b.js
CommonJS
針對第一個,可以透過一個例子來說明
針對第二點,給出例子
針對第三點,也可以給出一個例子
可以看看這篇部落格的一個對於CommonJS和ES6模組的總結。傳送門:commonjs模組和es6模組的區別 - unclekeith - 部落格園
ES6模組
針對第一點,可以給出例項。在改變變數時會報錯。
針對第二點,這裡與CommonJS模組機制不同的是,只要引用存在就可以執行程式碼了。同樣可以看看上邊給出的一篇文章。
在vue裡面能夠使用import命令,並且可以透過Node.js起本地伺服器而不會報錯的原因是在於vue使用babel對ES6的模組系統進行了編譯,將其轉換為CommonJS規範了
目前最新版本的Node仍然以CommonJS作為模組規範,所以要使用ES6模組系統暫時還是需要babel的
另外,CommonJS和ES6的模組系統主要存在以下區別
如有兩個檔案,a.js和b.js
CommonJS
透過require引入基礎資料型別時,屬於複製該變數。透過require引入複雜資料型別時,資料淺複製該物件。出現模組之間的迴圈引用時,會輸出已經執行的模組,而未執行的模組不輸出(比較複雜)CommonJS模組預設export的是一個物件,即使匯出的是基礎資料型別針對第一個,可以透過一個例子來說明
針對第二點,給出例子
針對第三點,也可以給出一個例子
可以看看這篇部落格的一個對於CommonJS和ES6模組的總結。傳送門:commonjs模組和es6模組的區別 - unclekeith - 部落格園
ES6模組
不管是基礎(複雜)資料型別,都只是對該變數的動態只讀引用。動態在於一個模組中變數的變化會影響到另一個模組;只讀在於從某個模組引入一個變數時,不允許修改該變數的值。對於複雜資料型別,可以新增屬性和方法,但是不允許指向另一個記憶體空間。出現模組之間的迴圈引用時,只要模組存在某個引用,程式碼就能夠執行。針對第一點,可以給出例項。在改變變數時會報錯。
針對第二點,這裡與CommonJS模組機制不同的是,只要引用存在就可以執行程式碼了。同樣可以看看上邊給出的一篇文章。