web-dev-qa-db-fra.com

React app bloqué sur "Démarrage du serveur de développement"

J'ai une application react créée par create-react-app. Après avoir exécuté npm start (le script de démarrage est présent dans package.json sous le nom "start": "react-scripts start"), la console indique Démarrage normal du serveur de développement et démarre le navigateur. Mais après cela, la console et le navigateur ne font absolument rien indéfiniment. Aucune erreur ou sortie. Cela ne fait tout simplement rien.

14
kenneth-rebello

J'ai quelque chose de similaire qui m'arrive.

J'ai un projet React que je veux convertir en TypeScript et j'ai commencé comme vous l'avez noté avec "create-react-app", ajouté tous mes fichiers et espéré le meilleur - mais je suis resté coincé comme vous sur le "Démarrage du serveur de développement " message.

J'ai un Ram de 8 Go avec Windows 10 et une fois que j'ai utilisé le "npm start" par défaut pour la première fois, j'ai vu que le processus de nœud utilise beaucoup de mémoire - J'ai donc essayé de lui en donner plus et en même temps je me suis fatigué de modifier les utilisations du port de réaction.

  1. Ajouté ceci au script de démarrage dans package.json:

    "scripts": { "start": "PORT=3001 react-scripts --max_old_space_size=8128 start", ... }

  2. Fermé tous mes chrome (ils prennent assez de mémoire)

  3. Et lui a donné environ 1 minute pour courir

Après 1 minute, il a commencé à fonctionner et à partir de ce moment, il démarre rapidement et n'utilise pas autant de mémoire et ne dépend pas du port que je choisis

Dans mon cas - je suppose que la première fois que vous exécutez "npm start" sur le projet React TypeScript, il indexe probablement les fichiers (ou fait quelque chose de similaire - je ne suis pas sûr et j'ai probablement besoin de lire à ce sujet - je suis nouveau sur TypeScript) qui prennent beaucoup de mémoire.

Dans votre cas, cela pourrait être quelque chose de similaire

J'espère que ça aide :)

0
Sharon Lifshits

Enfin résolu cela. Pour moi, le problème résidait dans la configuration de mon webpack. J'avais un alias de webpack là-dedans dont le nom d'alias était le même que le nom de mon package npm.

c'est-à-dire mon package.json avait en haut ce qui suit.

"name": "@mycompany/react-common-components"

Dans mon webpack.config.js J'ai eu

alias: {
        '@mycompany/react-common-components': path.resolve(__dirname, '../src/components')
      },

Une fois que j'ai changé l'alias du webpack pour le suivant, tout a bien fonctionné

alias: {
        'react-common-components': path.resolve(__dirname, '../src/components')
      },
0
Simon Long

Je pense que vous pouvez avoir des problèmes avec Node et npm. Je recommanderais de vérifier les versions en premier - vous aurez besoin d'avoir Node> = 8.10 et npm > = 5.6 sur votre machine, et mettez-le à jour si nécessaire. Cela pourrait valoir la peine d'essayer de réinstaller le nœud.

La vérification dans les journaux des nœuds pourrait fournir des indices sur votre problème (plus d'informations sur la façon de se connecter ici )

0
Dan Ovidiu Boncut

Si vous ne l'avez pas éjecté, essayez: créez un nouveau projet create-react-app, installez les dépendances de votre projet, copiez sur les fichiers src et déplacez sur toute autre modification liée au projet en dehors de src dossier. Si les versions existantes et nouvelles de create-react-app sont différentes, assurez-vous de recopier votre code d'une manière qui s'adapte aux différences entre les versions; le dossier public, le fichier de service worker et package.json peuvent être des endroits à examiner. De plus, si vous n'avez pas redémarré votre machine, faites-le, cela a résolu des problèmes similaires pour moi.

0
bsapaka

Assurez-vous que vos dépendances dans package.json comprend les éléments suivants:

"react": "^16.12.0",
"react-dom": "^16.12.0",
"react-scripts": "3.3.0"

Et les scripts seront:

"scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test",
    "eject": "react-scripts eject"
}

Une fois que vous vous en êtes assuré, vous pouvez suivre les étapes suivantes:

1. npm install
2. npm run build
3. npm start

L'espoir fonctionnera pour vous.

0
Muhammad Zeeshan

eu le même problème, je devais d'abord le construire

npm build puis npm start

J'étais en train de réagir sur mon Mac et j'ai dû autoriser le terminal à interagir avec chrome avant que cela fonctionne.

0
Bluephlame

J'avais aussi le même problème. Essayez d'installer une version précédente de react-scripts.

npm install [email protected]

J'espère que cela t'aides!

0
Tayyab Ferozi