Как изменить папку `src` на что-то другое в приложении create-реагировать

Вы можете использовать react-app-rewired, чтобы переопределить конфигурацию путей реагирования. . В моем случае я могу изменить пути в файле config-overrides.js.

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;
    },
}

Я знаю, что это старый вопрос, но я все равно опубликую свое решение, так как оно может кому-то помочь.

Я заработал, выполнив следующие действия:

1. Выполнить npm run eject. Это раскрывает некоторые элементы внутренней конфигурации из приложения create-реагировать.
2. Откройте свой package.json и отредактируйте соответствующие регулярные выражения в jest.collectCoverageFrom и jest.testMatch, чтобы они соответствовали вашему тестовому пути.
3. Измените пути для appSrc, appIndexJs и testsSetup в файле config/paths.js

Не уверен, что это отвечает на ваш вопрос, но я попробую. Моя структура каталогов выглядит так:

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

В моем /root/package.json есть это:

  "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"
  },

и мой /root/app/package.json выглядит так:

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

Чтобы запустить версию Reactjs для разработки, в /root я могу просто запустить npm serve для обслуживания версии для разработчиков.

Я использую node и Express, поэтому для запуска рабочей версии Reactjs в /root я могу просто запустить сборку npm, чтобы создать каталог /root/app/build. У меня есть роутер, который выглядит так:

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

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

поэтому, когда я запускаю /root/app.js в узле и перехожу к «/», он открывает /root/app/public/index.html, а затем /root/app/index.js.

Надеюсь, это поможет.

Ответ T0astBread почти идеален, но есть дополнительная ссылка на src, которую он пропустил внутри modules.js.

Конкретно:

    return {
      src: paths.appSrc,
    };

необходимо изменить на

    return {
      newSrcName: paths.appSrc,
    };

Это отличный вопрос, и правильный сценарий для изменения имени этой папки — перенос старых проектов реагирования на CRA.

Вот еще один подход, который я нашел, который ломает меньше вещей:

Создайте символическую ссылку с помощью:

ls -s ./app src

Затем добавьте это в config-overrides.js, чтобы веб-пакет мог обрабатывать символическую ссылку:

module.exports = (config, ...rest) => {
    return { ...config, resolve: { ...config.resolve, symlinks: false } };
};

Затем установите react-app-rewired и добавьте это в ваш package.json:

запуск: запуск реакции-приложения,

Создайте файл в корне вашего проекта, вставьте этот код и запустите.

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');
});

Возможно, символическая ссылка может решить ваши причины, по которым вы хотите это сделать:

ln -s ./src/ ./app

Папка src останется, но вы сможете работать с ней, как если бы это была папка app.

Если, как и я, вы используете vscode, вы также можете сделать:

Cmd-shift-p найдите настройки рабочей области и добавьте следующее:

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

Вы можете сделать то же самое с другими редакторами