W jaki sposób pakiet Webpack może nie importować wszystkiego, co eksportuje? - javascript, ecmascript-6, webpack

Mam projekt podzielony na „moduły”.

Każdy moduł ma eksportuje plik który eksportuje wiele plików z modułu.

Zgodnie z konwencją wymagamy tylko tego, co jest widoczne w module.

Na przykład, jeśli mam moduły „Górny pasek” i „Obszar roboczy” i muszą się komunikować, „Górny pasek” ujawnia Tylko index.js i „Workspace” wymagają od niego żądanej części „górnego paska”:

TopBar / index.js:

export TopBarComponent from "./components/TopBarComponent"

export SomethingElse from "./service/SomethingElse"

Workspace / components / Workspace.js:

import {TopBarComponent} from "TopBarComponent"
....

Chociaż w ten sposób projekt jest bardzo modułowy, moim problemem jest to, że gdy „Workspace” wymaga „TopBarComponent”, po drodze importuje się „SomethingElse”.

Wszelkie pomysły na to, jak temu zapobiec przy założeniu, że indeks.js każdego modułu jest plikiem eksportu i ma tylko linie eksportu?

Odpowiedzi:

0 dla odpowiedzi № 1

Pozwolę sobie powiedzieć, że to proste.

1. Importowi / eksportowi ES6 powinien towarzyszyć moduł ładujący babel, ponieważ nie jest jeszcze obsługiwany przez przeglądarki.
2. Domyślny eksport powinien być importowany bez {} i innych korzystających z {}

Podałem podstawowy przykład, w którym Main.js używa TopBarComponent wyeksportowane wartości, a TopBarComponent używa wyeksportowanych wartości index.js. Jeśli wykonasz podstawowe kroki, nie powinno być żadnego problemu.

Na przykład. Jeśli masz

Zobacz poniższy kod

index.js

var something;
var data = "index Data 1"
export data
export default "index Data 2"

TopBarComponent.js

import defaultData , {data} from "index"
...
..
var topbardata = "something"
export default {key : []};
export topbardata ;

Main.js

import defaultData , {topbardata} from "TopBarComponent"

Eksportujesz tylko to, co chcesz. Kod reszty nie jest zawarty w eksport nigdy nie jest importowany

---