Vyhledávání na webu

typescript - Problém s používáním yarn link pro využití lokálního npm balíčku, který má peerDependencies

Setkávám se s následujícím problémem při pokusu o vývoj knihovny komponent React pomocí styled-components.

Pro účely tohoto příkladu předpokládejme, že máme dvě repozitáře, app a core, a že core bude používáno app.

Aktuálně je core napsáno v TypeScriptu a sestavováno pomocí tsc.

Abych mohl rychle iterovat, pokusil jsem se použít yarn link k propojení core do app.

Toto funguje dobře pro to, aby app našel core... problém, se kterým se potýkám, nastává, když kompilovaný TypeScript kód core se pokusí vyžadovat balíček, například styled-components, a snaží se tento balíček najít v node_modules core (ne v app). Protože mám styled-components jako peerDependency i devDependency, je schopen jej najít v node_modules core, ale toto není to, co chci, aby se stalo. Chtěl bych, aby používal styled-components z app.

Jednou z alternativ k yarn link, kterou jsem zkoušel, je přidání závislosti core do app přes file:/path. Zdá se, že to funguje podle očekávání, ale přináší to nové problémy. Jak mohu mít cestu na mém vývojovém počítači v package.json jen pro lokální vývoj (bez neustálého přepínání zpět a vpřed)? Také se zdá, že jakékoli aktualizace provedené v core vyžadují, aby byl balíček odstraněn z app a byla vymazána cache yarnu před jeho opětovným přidáním.

Existuje nějaký jednodušší způsob, jak tento scénář zprovoznit? Právě jsem začal zkoumat Rollup nebo Webpack jako řešení, ale nejsem si jistý, jestli je to správný směr.

Odpověď č. 1

to není řešení pro yarn link.

ale řešení pro každého, kdo má problém se správou lokálních repozitářů pomocí yarn a npm

jednoduše použijte yalc k správě vašich lokálních balíčků místo yarn link nebo yarn add link:...

Odpověď č. 2

Budeme potřebovat knihovnu styled-component v devDependencies hlavního repozitáře, protože je vyžadována pro vývoj znovupoužitelných komponent v hlavním repozitáři.

Současně budeme muset říci repozitáři aplikace, aby načetl peerDependencies repozitáře core z node_modules repozitáře aplikace.

Pro to můžeme použít webpack. Například pokud jsme použili react-scripts k vytvoření repozitáře aplikace, můžeme spustit yarn eject a najít webpack.config.js ve složce config a můžeme změnit sekci resolve.alias.

app/config/webpack.config.js

{
  ...
  resolve: {
    ...
    alias: {
      ...
      core: path.resolve("./node_modules/core") // path must be imported above.
    }  
  }
}

Pro více informací: https://blog.maximeheckel.com/posts/duplicate-dependencies-npm-link

Související články