Verwenden Sie Komponenten aus zwei Versionen der gleichen Bibliothek (npm/Material UI in meinem Fall)

Ich verwende die neueste stabile Version von Material UI in meiner Produktion React App.Verwenden Sie Komponenten aus zwei Versionen der gleichen Bibliothek (npm/Material UI in meinem Fall)

Ich brauche die aktualisierte Datentabellen-Komponente, die sich derzeit in der unstabilen Alpha-Verzweigung von Material UI befindet.

Ich möchte nicht meine ganze App mit npm i [email protected] wegen der zahlreichen brechenden Änderungen aktualisieren.

Wie kann ich auf die Alpha-Bibliothek zugreifen, ohne meine gesamte Bibliothek zu aktualisieren? Kann ich zwei Versionen von MUI installieren? Kann ich die Alpha-API aufrufen, ohne sie über NPM zu installieren?

Vielen Dank im Voraus.

Quelle

2017-02-15 Doa

Installieren mehrerer Versionen eines Pakets parallel nutzen mit 'npm' nicht möglich ist. Die beste Problemumgehung, die ich gesehen habe, besteht darin, ein "Shim" -Paket zu erstellen (ex 'material-ui-next', das von' material-ui @ next' abhängt) und von dem in Ihrem Projekt abhängig ist. – Aaron

danke @Aaron - Ich bin vertraut mit Shims in der Npm-Registrierung, müsste ich ein neues, umbenanntes NPM-Paket erstellen, oder kann ich das lokal tun? – Doa

Ja, Sie können ein lokales Dateisystem-Modul '' installieren ''(https://docs.npmjs.com/cli/install), indem Sie' npm install./Path/to/material-ui-next' verwenden oder [verwenden 'npm link'] (https://docs.npmjs.com/cli/link). – Aaron

Ich habe in /packages ein Ordner material-ui-next mit nur einem package.json Inneren genannt, die enthält:

{ 
    "name": "material-ui-next", 
    "version": "1.0.0", 
    "scripts": { 
    "postinstall": "mv node_modules/material-ui/* ." 
    }, 
    "dependencies": { 
    "material-ui": "next" 
    } 
}

So, jetzt von der Wurzel des Projekts kann man npm install packages/material-ui-next --save tun, dann kann man createPalette = require('material-ui-next/styles/palette') oder was auch immer man verlangen will von material-ui jetzt aliased als material-ui-next.

Erläuterungen: als "material-ui": "next" ist eine Abhängigkeit es in node_modules/material-ui so installiert werden, ist material-ui-next installiert ein Skript, nachdem das Paket durch Hinzufügen node_modules/material-ui an die Wurzel des Pakets bewegen wir require('material-ui-next/WHATEVER')

Quelle

2017-03-14 12:43:41

verschiebt es nicht auch den ursprünglichen Ordner 'node_modules/material-ui /'? – Kuf

Ich bin nicht sicher, Ihre Frage zu verstehen, aber wenn Sie sich fragen, ob die Postinstall-Skripte das Modul Ihres eigentlichen Projekts verschieben können, ist dies nicht der Fall, weil der Stammordner des Skripts tatsächlich% YOURPROJECTROOT%/node_modules/material ist -ui-next und dieser Ordner enthält weitere node_modules mit Material-ui, deren Inhalt vom Skript an den Anfang des Ordners material-ui-next verschoben wird. Beantwortet das deine Frage ? –

Nach einigen googeln, this finden kann . Um beide Versionen zu verwenden:

yarn add [email protected] 
yarn add [email protected]:[email protected]

Dann können Sie

import Divider from 'material-ui-next/Divider'

oder

import Divider from 'material-ui/Divider'

Quelle

2017-08-12 15:31:31 Kuf

Ich habe die beiden Versionen der Bibliothek erfolgreich mit Yarn hinzugefügt, aber nach dem Kompilieren bekomme ich: TypeError: Kann die Eigenschaft prepareStyles von undefined nicht lesen. – Jumpa

@Jumpa gleich hier. Ich denke, dass es mit der unterschiedlichen Art und Weise zu tun hat, wie MuiThemeProvider in den zwei verschiedenen Versionen verwendet wird. Ich versuche das derzeit zu lösen - lassen Sie es mich wissen, wenn Sie eine Lösung finden. – BarthesSimpson

es gibt eine einschränkung zu dieser lösung: jedes mal, wenn ich ein "garn upgrade" mache, wandelt garn beide material-ui-versionen in package.json in die "nächste" version um. Ich muss dann manuell auf 0,20.0 korrigieren, node_modules und yarn.lock löschen, dann wieder Garn laufen lassen – Alex

Verwenden Sie Komponenten aus zwei Versionen der gleichen Bibliothek (npm/Material UI in meinem Fall)

Antwort

Verwandte Themen