Создание dev-версии реагирующего приложения, непрерывно, для разработки

Question

Я только что создал приложение реагирования, запустив:

create-react-app foo

, который создал package.json файл с:

{
  "name": "foo",
  "version": "0.1.0",
  "private": true,
  "dependencies": {
    "react": "^16.7.0",
    "react-dom": "^16.7.0",
    "react-scripts": "2.1.3"
  },
  "scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test",
    "eject": "react-scripts eject"
  },
  "eslintConfig": {
    "extends": "react-app"
  },
  "browserslist": [
    ">0.2%",
    "not dead",
    "not ie <= 11",
    "not op_mini all"
  ]
}

npm start и npm run build оба выполняются, как и предполагалось, но это приложение является интерфейсом для приложения Django, поэтому, чтобы немного улучшить работу с dev mimic, я не хочу обслуживать приложение с node.js. Что я хочу сделать, так это непрерывно создавать ресурсы, HTML, JS и т. Д. И позволить Django обслуживать их, как и любой другой HTML / JS / CSS. Я помню, как Webpack делал это в прошлый раз, когда я играл с ним пару лет назад.

Как мне это сделать в контексте данного приложения реагирования? Короче говоря, как заставить npm run build постоянно работать с изменениями файлов и генерировать ресурсы разработчика.

Answer 1

Вы можете установить пакет watch в качестве dev-зависимости и добавить в свой package.json скрипт, который отслеживает изменения в папке src и запускает npm run build:

npm install --save-dev watch

// package.json
"scripts": {
  "watch": "watch 'npm run build' src/"
}

Затем, пока вы работаете, продолжайте открывать вкладку с:

npm run watch

Учтите, однако, что сборка может быть долгим процессом. Это зависит от размера вашего приложения.