Obecnie używam ES6 w aplikacji React przez webpack / babel. Korzystam z plików indeksu, aby zebrać wszystkie komponenty modułu i wyeksportować je. Niestety wygląda to tak:
import Comp1_ from './Comp1.jsx';
import Comp2_ from './Comp2.jsx';
import Comp3_ from './Comp3.jsx';
export const Comp1 = Comp1_;
export const Comp2 = Comp2_;
export const Comp3 = Comp3_;
Więc mogę ładnie zaimportować go z innych miejsc takich jak ten:
import { Comp1, Comp2, Comp3 } from './components';
Oczywiście nie jest to bardzo miłe rozwiązanie, więc zastanawiałem się, czy jest jakiś inny sposób. Wydaje się, że nie jestem w stanie wyeksportować importowanego komponentu bezpośrednio.
javascript
ecmascript-6
webpack
babeljs
MoeSattler
źródło
źródło
Odpowiedzi:
Możesz łatwo ponownie wyeksportować domyślny import:
Istnieje również propozycja dla
ES7ES8 , która pozwoli Ci pisaćexport Comp1 from '…';
.źródło
Pamiętaj też, że jeśli musisz wyeksportować wiele funkcji jednocześnie, takich jak akcje, których możesz użyć
źródło
SyntaxError: Unexpected reserved word
, zaakceptowana odpowiedź @ Bergi działa.Za późno, ale chcę opisać sposób rozwiązania tego problemu.
Posiadanie
model
pliku o dwóch nazwanych eksportach:i posiadający
controller
plik, który ma domyślny eksport:Udostępniłem w
index
pliku w ten sposób:i zakładając, że chcę je wszystkie zaimportować:
źródło
Po prostu:
Lub według nazw funkcji:
Więcej informacji: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/export
źródło
Zainstaluj
@babel/plugin-proposal-export-default-from
przez:yarn add -D @babel/plugin-proposal-export-default-from
W twoim
.babelrc.json
lub dowolnym typie plików konfiguracyjnychTeraz możesz
export
bezpośrednio zfile-path
:Powodzenia...
źródło