webentwicklung-frage-antwort-db.com.de

Holen Sie sich die Versionsnummer von package.json in React Redux (create-react-app)

OP EDIT: Wenn jemand anderes darauf stößt: Die App wurde mit create-react-app erstellt, wodurch der Import auf den Ordner src beschränkt wird. Wenn Sie jedoch Reaction-Skripte auf Version 1.0.11 aktualisieren , können Sie auf package.json zugreifen.

Ich versuche, die Versionsnummer von package.json in meiner App abzurufen.

Ich habe bereits versucht diese Vorschläge , aber keiner von ihnen hat funktioniert, da ich nicht von außerhalb des src-Ordners auf package.json zugreifen kann (möglicherweise aufgrund von React, ich bin neu in diesem Bereich). Das Verschieben von package.json nach src bedeutet dann, dass ich npm install, npm version minor Und npm run build Nicht in meinem Stammordner ausführen kann. Ich habe versucht, process.env.npm_package_version Zu verwenden, aber das führt zu undefined.

Ich verwende Jenkins und habe es noch nicht so eingerichtet, dass es die Commits anpusht. Die einzige Idee, die ich habe, ist, die Version aus den Tags in GitLab abzurufen, aber ich habe keine Ahnung, wie das geht und wie würde dem Repo unnötige Abhängigkeit hinzufügen, daher würde ich wirklich gerne eine Alternative finden.

EDIT: Meine Dateistruktur ist wie folgt:

--> RootAppFolder
    |--> build
    |--> node_modules
    |--> public
    |--> src
         |--> Components
              |--> Root.js
    |
    |--> package.json

Um also über Root.js auf package.json zuzugreifen, muss ich import packageJson from './../../package.json' Ausführen und bekomme dann die folgende Fehlermeldung:

./src/components/Root.js

Modul nicht gefunden: Sie haben versucht, ./../../package.json zu importieren, das sich außerhalb des Projektverzeichnisses src/befindet. Relative Importe außerhalb von src/werden nicht unterstützt. Sie können es entweder in src/verschieben oder einen Symlink von node_modules/des Projekts hinzufügen.

26
Baldeep

Von deiner Bearbeitung würde ich vorschlagen, es zu versuchen

import packageJson from '/package.json';

Sie können auch versuchen, einen Symlink zu erstellen:

# From the project root.
cd src; ln -s ../package.json package.alias.json

Listen Sie den Inhalt des src-Verzeichnisses auf und Sie sehen den Symlink.

ls
#=> package.alias.json -> ../package.json

Das Hinzufügen des .alias Hilft, die Magie für andere und Ihr zukünftiges Selbst zu reduzieren, wenn Sie dies betrachten. Außerdem hilft es Texteditoren, sie auseinander zu halten. Du wirst mir später danken. Stellen Sie einfach sicher, dass Sie Ihren JS-Code für den Import von ./package.alias.json Anstelle von ./package.json Aktualisieren.

Schauen Sie sich auch diese Frage an: Die Importbeschränkung für create-react-app außerhalb des src-Verzeichnisses

14
kenfire

Lösen Sie dies, ohne package.json Zu importieren und mit create-react-app Zu belichten.

Benötigt: Version 1.1.0 + von create-react-app

.env

REACT_APP_VERSION=$npm_package_version
REACT_APP_NAME=$npm_package_name

index.js

console.log(`${process.env.REACT_APP_NAME} ${process.env.REACT_APP_VERSION}`)

Hinweis: Auf die Version (und viele andere npm config params ) kann zugegriffen werden

50
talves

Versuche dies.

// in package.json
"version": "1.0.0"

// in index.js
import packageJson from '../package.json';
console.log(packageJson.version); // "1.0.0"
30