webentwicklung-frage-antwort-db.com.de

Wie ändere ich den `src`-Ordner in einem anderen Programm in der Create-React-App?

Ich möchte wissen, ob es möglich ist, src mit react-script in einen anderen Ordner wie app umzubenennen

16
rstormsf

Ich weiß, das ist eine alte Frage, aber ich werde trotzdem meine Lösung posten, da sie jemandem helfen könnte.

Ich habe es mit den folgenden Schritten zum Laufen gebracht:

  1. Führen Sie npm run eject aus. Dadurch werden einige interne Konfigurationsdaten von create -react-app verfügbar gemacht
  2. Öffnen Sie Ihren package.json und bearbeiten Sie die entsprechenden Ausdrücke unter jest.collectCoverageFrom und jest.testMatch entsprechend Ihrem Testpfad
  3. Ändern Sie die Pfade für appSrc, appIndexJs und testsSetup in der config/paths.js-Datei
2
T0astBread

Erstellen Sie eine Datei im Stammverzeichnis Ihres Projekts, fügen Sie diesen Code ein und führen Sie das Programm aus.

const fs = require('fs');
const path = './node_modules/react-scripts/config/paths.js';
const folder = 'app';

fs.readFile(path, 'utf8', (err, data) => {
 if (err) throw err;
 data = data.replace(/src/g, folder);
 fs.writeFile(path, data, 'utf8');
});

0
IT VLOG

Sie können react-app-rewired verwenden, um die Konfiguration der Reaktionspfade zu überschreiben. In meinem Fall kann ich die Pfade in der Datei config-overrides.js ändern

const path = require('path');

module.exports = {
    paths: function (paths, env) {        
        paths.appIndexJs = path.resolve(__dirname, 'mysrc/client.js');
        paths.appSrc = path.resolve(__dirname, 'mysrc');
        return paths;
    },
}
0
Cong Dan Luong

Ich bin mir nicht sicher, ob dies Ihre Frage beantwortet, aber ich werde es versuchen. Meine Verzeichnisstruktur sieht so aus:

/root
--/app
----/build
----/public
------index.html
----/src
------index.js
app.js
package.js

Mein /root/package.json enthält folgendes:

  "scripts": {
    "build": "cd app && npm run build",
    "start": "node app.js",
    "serve": "cd app && npm run start"
  },
  "dependencies": {
    "express": "^4.8.0",
    "react": "^16.2.0",
    "react-dom": "^16.2.0",
    "react-router": "^4.2.0",
    "react-router-dom": "^4.2.2",
    "react-scripts": "^1.0.17"
  },

und mein /root/app/package.json sieht so aus:

  "scripts": {
    "build": "react-scripts build",
    "start": "set PORT=3000 && react-scripts start"
  },
  "dependencies": {
    "react-scripts": "^1.0.17"
  }

Um die Entwicklungsversion von Reactjs auszuführen, kann ich im/root einfach npm ausführen, um die Dev-Version zu bedienen.

Ich verwende node und express. Um die Produktionsversion von Reactjs auszuführen,.... Im/root-Verzeichnis kann ich einfach npm ausführen, um das Verzeichnis/root/app/build zu erstellen. Ich habe einen Router, der so aussieht:

var options = {root : config.siteRoot + '/app/build'};

mainRte.all('/', function(req, res) {
    console.log('In mainRte.all Root');
    res.sendFile('index.html', options);
});

wenn ich also im Knoten "/root/app.js" starte und nach "/" surfe, wird "/root/app/public/index.html" und dann /root/app/index.js geöffnet.

Hoffentlich hilft das.

0
Joe Shmoe

Möglicherweise spricht ein symbolischer Link Ihre Gründe dafür an: 

ln -s ./src/ ./app

Der src-Ordner bleibt erhalten, aber Sie können damit arbeiten, als wäre es der app-Ordner. 

Wenn Sie wie ich vscode verwenden, können Sie auch Folgendes tun: 

Cmd-shift-p Sucharbeitsbereich-Einstellungen und fügen Sie Folgendes hinzu: 

{
  "files.exclude": {
      "src/": true
  }
}

Mit anderen Editoren könnte man das ähnlich machen

0
Dan