Jak mogę warunkowo zaimportować moduł ES6?

Question

muszę zrobić coś takiego:

if (condition) { 
    import something from 'something'; 
} 
// ... 
if (something) { 
    something.doStuff(); 
} 

Powyższy kod nie kompiluje; rzuca SyntaxError: ... 'import' and 'export' may only appear at the top level.

Próbowałem użyć System.import jak pokazano here, ale nie wiem skąd pochodzi System. Czy to propozycja ES6, która ostatecznie nie została zaakceptowana? Link do "programistycznego API" z tego artykułu rzuca mnie na numer deprecated docs page.

Answer 1

Mamy teraz propozycję importu dynamicznego z ECMA. To jest na etapie 3. Jest to również dostępne pod numerem babel-preset.

Poniżej przedstawiono sposób renderowania warunkowego zgodnie ze swoim przypadkiem.

if (condition) { 
    import('something') 
    .then((something) => { 
     console.log(something.something); 
    }); 
} 

To zasadniczo zwraca obietnicę. Rozstrzygnięcie obietnicy ma mieć moduł. Wniosek ma również inne funkcje, takie jak wiele importów dynamicznych, import domyślny, import plików js itd. Więcej informacji na temat dynamic imports here można znaleźć.

Answer 2

Wygląda na to, że odpowiedź brzmi, że od tej chwili nie można.

http://exploringjs.com/es6/ch_modules.html#sec_module-loader-api

Myślę, że intencją jest umożliwienie analizy statycznej jak najwięcej, a warunkowo importowane moduły złamać to. Warto również wspomnieć - używam Babel i domyślam się, że System nie jest wspierany przez Babel, ponieważ API modułu ładującego moduły nie stał się standardem ES6.

Answer 3

Jeśli chcesz, możesz użyć wymagania. Jest to sposób na warunkowe żądanie wymagające.

if (condition) { 
    const something = require('something'); 
    const other = require('something').other; 
} 
if (something && other) { 
    something.doStuff(); 
    other.doOtherStuff(); 
} 

Answer 4

Nie można zaimportować warunkowo, ale można zrobić odwrotnie: wyeksportować coś warunkowo. To zależy od twojego przypadku użycia, więc ta praca może nie być dla ciebie.

można zrobić:

api.js

import mockAPI from './mockAPI' 
import realAPI from './realAPI' 

const exportedAPI = shouldUseMock ? mockAPI : realAPI 
export default exportedAPI 

apiConsumer.js

import API from './api' 
... 

używam tego drwić analityki libs jak mixpanel itp ... bo mogę” • Mamy obecnie wiele buildów lub naszą frontend. Nie jest to najbardziej elegancki, ale działa. Mam tylko kilka "jeśli" tu i tam w zależności od środowiska, ponieważ w przypadku miksera wymaga on inicjalizacji.

Answer 5

zasłaniając go w eval pracował dla mnie, ukrywając go z analizatora statyczne ...

if (typeof __CLI__ !== 'undefined') { eval("require('fs');") }