ES6 Javascript導入多個名稱相同的js文件

Question

我正在使用ES6，我想導入相同的文件作爲2個不同的名稱。

import Contact from './Grid' 
import Account from './Grid' 

有沒有一種方法，我可以有網格命名的聯繫人和帳戶沒有webpack多次導入它？

Answer 1

沒有的WebPack導入它多次？

使用兩個單獨的導入語句將不會多次執行該文件。一旦一個文件被加載一次，它的導出值就被緩存起來，供以後的調用使用。鑑於此，將其歸入一個聲明的唯一原因是潛在的可讀性改進。這就是說，回答你的問題，你可以做

import { 
    default as Contact, 
    default as Account, 
} from './Grid'; 

如果你想。你也可能做

import Contact from './Grid' 
const Account = Contact; 

只是注意，它不會做相當在那裏有你的模塊循環依賴的情況下同樣的事情。

Answer 2

如果在你的網格文件中，你正在導出你想要的對象/函數等。作爲默認導出（請參見下文），您可以在導入時使用任何想要的名稱。一個例子，如果電網是一個功能是：

//Grid file 
export default function Grid() { 
    // your Grid info 
} 

和

//import file 
import Contact from './Grid' 
import Account from './Grid'