React-Konfiguration px-Konvertierung rem-Methode

Installieren Sie zugehörige Abhängigkeiten

npm ich lib-flexible --save
npm ich postcss-px2rem --save

Wird hauptsächlich verwendet, um die Projektkonfiguration verfügbar zu machen

npm führt auswerfen
! Wenn Sie npm run eject ausführen und eine Fehlermeldung erhalten, kann der Fehler daran liegen, dass der Code im Repository nicht übermittelt wurde. Senden Sie ihn wie folgt
git add.
git commit -m 'benutzerdefinierter Name'
npm führt auswerfen

Öffnen Sie dann das Projekt config->webpack.config.js zur Konfiguration

//Fügen Sie der Konfigurationsdatei die folgenden zwei Codezeilen hinzu
// px2rem({ remUnit: 75 }) bedeutet 1rem = 75px. Dies basiert auf dem 750px-Designentwurf. Wenn es 620 sind, schreiben Sie 62

const px2rem = erfordern('postcss-px2rem');
px2rem({ remUnit: 75 })

Stellen Sie es entsprechend der Designgröße ein, z. B.: 108 = 1080px/10

Import lib-flexible: Importieren Sie die lib-flexible Datei in die Eintragsdatei index.js

importiere 'lib-flexible'

Kommentieren Sie den folgenden Code in der Datei public->index.html aus

Starten Sie das Projekt neu, nachdem die Konfiguration abgeschlossen ist

Dies ist das Ende dieses Artikels über die Konfiguration von React zur Konvertierung von px in rem. Weitere Informationen zur Konfiguration von React zur Konvertierung von px in rem finden Sie in früheren Artikeln auf 123WORDPRESS.COM oder in den folgenden verwandten Artikeln. Ich hoffe, Sie werden 123WORDPRESS.COM auch in Zukunft unterstützen!