Nazwa importu zmiennej ES6 w node.js?

czy można zaimportować coś do modułu podając nazwę zmiennej podczas korzystania z importu ES6?

To znaczy chcę zaimportować jakiś moduł w czasie wykonywania w zależności od wartości podanych w konfiguracji:

import something from './utils/' + variableName;

Nie z importoświadczeniem. importi exportsą zdefiniowane w taki sposób, że można je analizować statycznie, więc nie mogą zależeć od informacji o czasie wykonywania.

Szukasz API modułu ładującego (polyfill) , ale jestem trochę niejasny co do statusu specyfikacji:

System.import('./utils/' + variableName).then(function(m) {
  console.log(m);
});

Oprócz odpowiedzi Felixa , zauważę wyraźnie, że nie jest to obecnie dozwolone w gramatyce ECMAScript 6 :

Deklaracja importu :

• import ImportClause FromClause;

• import ModuleSpecifier;

FromClause :

• z ModuleSpecifier

ModułSpecifier :

• StringLiteral

ModuleSpecifier może być tylko literał łańcuchowy , a nie innego rodzaju ekspresji niczym AdditiveExpression .

Chociaż w rzeczywistości nie jest to import dynamiczny (np. W moich okolicznościach wszystkie pliki, które importuję poniżej, zostaną zaimportowane i dołączone do pakietu internetowego, a nie wybrane w czasie wykonywania), wzorzec, którego używam, który może pomóc w pewnych okolicznościach to :

import Template1 from './Template1.js';
import Template2 from './Template2.js';

const templates = {
  Template1,
  Template2
};

export function getTemplate (name) {
  return templates[name];
}

lub alternatywnie:

// index.js
export { default as Template1 } from './Template1';
export { default as Template2 } from './Template2';


// OtherComponent.js
import * as templates from './index.js'
...
// handy to be able to fall back to a default!
return templates[name] || templates.Template1;

Nie sądzę, żebym mógł tak łatwo wrócić do wartości domyślnej za pomocą require(), co powoduje błąd, jeśli spróbuję zaimportować skonstruowaną ścieżkę szablonu, która nie istnieje.

Dobre przykłady i porównania między wymaganiami i importem można znaleźć tutaj: http://www.2ality.com/2014/09/es6-modules-final.html

Doskonała dokumentacja dotycząca ponownego eksportu z @iainastacio: http://exploringjs.com/es6/ch_modules.html#sec_all-exporting-styles

Interesuje mnie opinia na temat tego podejścia :)

Istnieje nowa specyfikacja nazywana dynamicznym importem dla modułów ES. Po prostu dzwonisz import('./path/file.js')i jesteś gotowy. Funkcja zwraca obietnicę, która jest rozpatrywana z modułem, jeśli import się powiódł.

async function importModule() {
   try {
      const module = await import('./path/module.js');
   } catch (error) {
      console.error('import failed');
   }
}

Przypadków użycia

Przypadki użycia obejmują importowanie komponentów oparte na trasach dla React, Vue itp. Oraz możliwość leniwego ładowania modułów , gdy są one wymagane w czasie wykonywania.

Dalsza informacja

Oto wyjaśnienie w Google Developers .

Zgodność z przeglądarkami (kwiecień 2020 r.)

Według MDN jest obsługiwany przez wszystkie obecnie popularne przeglądarki (z wyjątkiem IE), a caniuse.com wykazuje 87% poparcia w globalnym udziale w rynku. Znowu brak wsparcia w IE lub non-chromium Edge.

Rozumiem pytanie zadane konkretnie dla ES6 importw Node.js, ale poniższe mogą pomóc innym szukającym bardziej ogólnego rozwiązania:

let variableName = "es5.js";
const something = require(`./utils/${variableName}`);

Uwaga, jeśli importujesz moduł ES6 i chcesz uzyskać dostęp do defaulteksportu, musisz użyć jednej z następujących opcji:

let variableName = "es6.js";

// Assigning
const defaultMethod = require(`./utils/${variableName}`).default;

// Accessing
const something = require(`./utils/${variableName}`);
something.default();

Możesz również użyć destrukturyzacji z tym podejściem, które może zwiększyć znajomość składni z innymi importami:

// Destructuring 
const { someMethod } = require(`./utils/${variableName}`);    
someMethod();

Niestety, jeśli chcesz uzyskać dostęp, defaulta także zniszczyć, musisz wykonać to w kilku krokach:

// ES6 Syntax
Import defaultMethod, { someMethod } from "const-path.js";

// Destructuring + default assignment
const something = require(`./utils/${variableName}`);

const defaultMethod = something.default;    
const { someMethod, someOtherMethod } = something;

możesz do tego użyć notacji innej niż ES6. to działa dla mnie:

let myModule = null;
if (needsToLoadModule) {
  myModule = require('my-module').default;
}

Mniej podoba mi się ta składnia, ale działa:
zamiast pisać

import memberName from "path" + "fileName"; 
// this will not work!, since "path" + "fileName" need to be string literal

użyj tej składni:

let memberName = require("path" + "fileName");

Import dynamiczny () (dostępny w Chrome 63+) wykona Twoją pracę. Oto jak:

let variableName = 'test.js';
let utilsPath = './utils/' + variableName;
import(utilsPath).then((module) => { module.something(); });

Zrobiłbym to w ten sposób

function load(filePath) {
     return () => System.import(`${filePath}.js`); 
     // Note: Change .js to your file extension
}

let A = load('./utils/' + variableName)

// Now you can use A in your module

./utils/test.js

export default () => {
  doSomething...
}

zadzwoń z pliku

const variableName = 'test';
const package = require(`./utils/${variableName}`);
package.default();