ES6動態導入和實例化類

Question

我試圖弄清楚如何在服務器端（帶有Babel的node.js）之一的ES6中動態導入類。 我想擁有一些與Java反射提供的功能類似的功能。 想法是將所有類導入特定的文件夾並動態實例化。

因此，例如，我可以在一個文件夾中聲明多個類，如下所示：

export default class MyClass {

   constructor(somevar) {
       this._somevar = somevar
   }

   //...
   //some more instance level functions here
}

然后在我的應用程序代碼的其他地方，我可以擁有一個函數，該函數可以找出特定文件夾中的所有類並嘗試實例化它們：

//somewhere else in my app
instanciationFunction(){

   //find all the classes in a specific folder
   var classFiles = glob.sync(p + '/path_to_classes/**/*.js', {
       nodir: true
   });

   _.each(classFiles, async function (file) {
       console.log(file);

       var TheClass = import(file);
       var instance = new TheClass();

       //and then do whatever I want with that new instance

   });
}

我嘗試使用require進行操作，但出現錯誤。 顯然找不到構造函數。

任何想法將不勝感激。

謝謝

Answer 1

ES模塊定義是聲明性的，當前的指導工具所采用的路徑是解析（通過靜態分析）期間確定依賴項的路徑，通常在執行任何代碼之前就已經確定了。 這意味着動態和有條件的導入與上述路徑背道而馳。 這與在Node中執行導入和執行require時確定導入的情況不同。

如果要動態導入運行時，請考慮看看SystemJS 。 如果您熟悉RequireJS ，則采用相同的概念，但會將其擴展為多種模塊格式 ，包括ES6。 它具有SystemJS.import ，它似乎可以完成您想做的事情，還可以處理當前正在執行的路徑解析。

另外，如果您打算去除多余的代碼，請考慮使用Rollup 。 它將為您分析代碼，僅包含實際使用的代碼。 這樣，您無需手動執行條件加載。

Answer 2

您需要使用babel進行預處理，因為它們還不是節點的一部分（因此，它們都不是靜態導入 -節點使用require ）。

https://github.com/airbnb/babel-plugin-dynamic-import-node

腳步：

預

npm i -D babel-cli或npm i -D babel

1

npm i -D babel-plugin-dynamic-import-node

2 .babelrc

 { "plugins": ["dynamic-import-node"] } 

預備，開始！

babel-node test_import.js cli或原始babel的babel-node test_import.js ：

一個（edit）package.json

 "scripts": { "pretest": "babel test_imports.js -o dist/test_imports.js", "test": "node dist/test_imports.js" //... 

b

node test