React und Grunt - Envify NODE_ENV = 'production' und UglifyJS

8

Ich verwende Grunt , um ein React-Projekt zu erstellen, und ich möchte "dev" - und "prod" -Armen haben. Als reacts docs sagt:

  

Um Reaktiv im Produktionsmodus zu verwenden, setzen Sie die Umgebungsvariable NODE_ENV auf Produktion.   Ein Minifier, der Dead-Code-Eliminierung durchführt, wie UglifyJS, ist   empfohlen, den im Entwicklungsmodus vorhandenen zusätzlichen Code vollständig zu entfernen.

Ich bin sehr neu mit Grunt, browserify und so, aber lass uns sehen. Das erste Problem, das ich habe, ist mit entify, ich benutze es als eine Transformation:

%Vor%

Ok, macht grunt: dev funktioniert gut. Also beim Ausführen von grunt: prod ... Wie kann ich NODE_ENV: 'production' einstellen? Ich meine, ich weiß, dass ich als eine Verwandlung "beneide", aber ... keine Ahnung, wie ich das anwenden soll.

Danach habe ich auch eine Uglify-Aufgabe:

%Vor%

Nach dem Aufruf von grunt: prod werden zwei Dateien erstellt (bundle.js und bundle-min.js). In der Produktion möchte ich nur bündel.min.js haben. Ich weiß, dass ich es kann:

js / bundle.js: ['js / bundle.js']

Aber mmm Ich weiß nicht, ob es eine Möglichkeit gibt, es einfach in bundle.min.js umzubenennen, ich denke schon ... das Problem ist, dass ich in der html habe:

%Vor%

Gibt es hier auch einen Trick, um entweder bundle.js oder bundle.min.js zu akzeptieren?

Vielen Dank im Voraus.

    
Ferran Negre 09.09.2014, 18:01
quelle

3 Antworten

18

Transformationen sind lokal und gut gemachte Pakete fügen ihre Transformationen in ihre package.json Datei ein. Sofern Sie nicht envify in Ihrem eigenen Code verwenden , müssen Sie nichts damit tun.

Was Sie brauchen, ist grunt-env oder eine andere Möglichkeit, Umgebungsvariablen festzulegen.

Hier ist eine Alternative mit package.json:

%Vor%

Der Vorteil hier ist, dass die Person, die Ihr Paket verwendet, nicht einmal global grunt installieren muss. npm run build führt ./node_modules/.bin/grunt build-dev mit der richtigen Umgebungsvariablen aus.

    
FakeRainBrigand 09.09.2014, 19:59
quelle
6

Die Antworten von John Reilly und FakeRainBrigand funktionierten nicht für mich. Was für mich funktionierte, war folgendes:

Schritt 1 - Führen Sie diesen Befehl aus, wo Ihre package.json

ist %Vor%

Schritt 2 - Fügen Sie den Code in "evn:" zu Ihrer Gruntfile.js in grunt.initConfig wie folgt hinzu:

%Vor%

Schritt 3 - Fügen Sie die grunt-Aufgabe zu Ihrer Gruntfile.js

hinzu %Vor%

Schritt 4 - Rufen Sie es wie folgt vor browserify auf:

%Vor%     
vullnetyy 07.08.2016 15:29
quelle
3

Nur eine Ergänzung zu der großartigen Antwort von FakeRainBrigand, wenn Sie unter Windows laufen (wie ich), dann brauchen Sie eine subtil unterschiedliche Syntax in Ihrem scripts -Abschnitt:

%Vor%     
John Reilly 09.09.2015 05:04
quelle