L'application React bloquée sur «Démarrage du serveur de développement»

15

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.

kenneth-rebello
la source
Étrange. Est-ce à chaque fois que vous créez un nouveau projet à l'aide de create-react-app?
Nikhil Goyal
pouvez-vous partager la capture d'écran du terminal, vérifier si une application fonctionne sur le port 3000, peut-être que cela peut être le problème (devinez !!), dans le terminal, il vous demandera d'appuyer sur oui ou non pour ouvrir l'application dans un autre port.
DILEEP THOMAS
Veuillez partager la capture d'écran de l'erreur
Ronak Khangaonkar
Oui, chaque fois que je démarre l'application, elle démarre sur un nouveau port. Cela se produit car une application Node est exécutée sur le port sur lequel je l'ai exécutée. J'arrête l'application en utilisant CTRL + C qui la ferme dans le terminal mais le gestionnaire de tâches affiche les processus toujours en cours. J'ai essayé de tuer ces processus à partir du gestionnaire de tâches et du terminal à l'aide de taskkill, mais les deux échouent. Ce dernier donne une erreur disant "Il n'y a pas d'instance en cours d'exécution de ce processus." Le redémarrage de l'application m'invite à utiliser un port différent (3000, 3001, 3002, etc.) auquel j'ai répondu par oui mais encore une fois je m'arrête au "Démarrage du serveur de développement"
kenneth-rebello
Je partagerais des captures d'écran mais il n'y a littéralement rien à montrer. Le terminal ne fera pas défiler vers le haut à partir de "Démarrage du serveur de développement" et le navigateur ne se charge que indéfiniment.
kenneth-rebello

Réponses:

2

Vérifiez ces points de remorquage

  1. Exécutez la commande npm install avant de démarrer le serveur.

Ensuite, il ne fonctionne pas, veuillez essayer la deuxième commande

  1. Supprimez les modules de noeud et exécutez à nouveau npm install.

Si ces deux points n'ont pas fonctionné, veuillez fournir la capture d'écran pour une analyse plus approfondie.

Jerrin stephen
la source
J'ai essayé les deux méthodes et les deux m'ont échoué, ce qui m'a conduit ici :( Un autre point à noter est que le package contenait peu de dépendances qui présentaient des vulnérabilités. Cela pourrait-il être une raison? Les points de suspension habituels sont "sill install executeActions" et "postinstall: verbe verrouiller en utilisant <chemin vers le cache npm>"
kenneth-rebello
@ kenneth-rebello fournit les captures d'écran pendant que vous exécutez le commentaire de démarrage du NPM. Si vous créez une application à l'aide de create-react-app, les packages installés par cette commande ne présenteront aucune vulnérabilité. Avez-vous essayé d'installer des packages ??
Jerrin stephen
Ayant le même problème et essayé cela sur un nouveau clone et toujours pas de chance.
Simon Long
J'ai également remarqué que la construction de npm se bloque également. Cela suggère que la compilation est le problème. Cependant, je ne vois rien dans la console ou dans les journaux npm. Je ne sais pas où aller d'ici sans rien continuer.
Simon Long
0

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 que mon package.jsonavait ce qui suit en haut.

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

Dans mon webpack.config.jsj'avais

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')
      },
Simon Long
la source
0

Il m'arrive quelque chose de similaire.

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 navigateurs chromés (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 simplement 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 probablement besoin de lire à ce sujet - je suis nouveau sur dactylographié ) qui prennent beaucoup de mémoire.

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

J'espère que cela aide :)

Sharon Lifshits
la source
0

Assurez-vous que vos dépendances dans package.jsonincluent 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.

Muhammad Zeeshan
la source
0

Je pense que vous pouvez rencontrer des problèmes avec Node et npm. Je recommanderais de vérifier d'abord les versions - vous devrez avoir Node> = 8.10 et npm> = 5.6 sur votre machine, et mettre à 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 )

Dan Ovidiu Boncut
la source
0

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

npm install react-scripts@2.1.8

J'espère que cela t'aides!

Tayyab Ferozi
la source
0

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 de fonctionner.

Bluephlame
la source
0

Pour moi, le problème était que j'avais des .cssfichiers.

J'ai renommé mes fichiers css en .scsset cela fonctionne.

Pour une raison quelconque, create-react-app s'étouffe avec les fichiers CSS pour moi.

Bizarre.

Oliver Watkins
la source