Aplicativo de reação travado em "Iniciando o servidor de desenvolvimento"

15

Eu tenho um aplicativo de reação criado por create-react-app. Após executar o npm start (o script start está presente no package.json como "start": "react-scripts start"), o console diz Iniciando o servidor de desenvolvimento como de costume e inicia o navegador. Mas depois disso, o console e o navegador não fazem absolutamente nada indefinidamente. Nenhum erro ou saída. Simplesmente não faz nada.

Kenneth-Rebello
fonte
Estranho. É sempre que você cria um novo projeto usando create-react-app?
Nikhil Goyal
você pode compartilhar a captura de tela do terminal, verificar se algum aplicativo está em execução na porta 3000, pode ser esse o problema (palpite !!), no terminal ele estará solicitando pressionar sim ou não para abrir o aplicativo em outra porta.
DILEEP THOMAS
Compartilhe a captura de tela do erro
Ronak Khangaonkar 7/19/19
Sim, toda vez que inicio o aplicativo, ele inicia em uma nova porta. Isso acontece porque um aplicativo Node é executado na porta em que eu o executei. Paro o aplicativo usando CTRL + C, que o fecha no terminal, mas o gerenciador de tarefas mostra os processos ainda em execução. Tentei matar esses processos do gerenciador de tarefas e do terminal usando o taskkill, mas ambos falham. O último fornece erro dizendo "Não há instância em execução deste processo". Iniciar o aplicativo novamente solicita que eu use uma porta diferente (3000, 3001, 3002 etc.) à qual respondi sim, mas novamente paro no "Iniciando o servidor de desenvolvimento"
kenneth-rebello
Gostaria de compartilhar capturas de tela, mas não há literalmente nada para mostrar. O terminal não irá rolar de volta em "Iniciando o servidor de desenvolvimento" e o navegador continuará carregando indefinidamente.
Kenneth-rebello

Respostas:

2

Verifique os pontos de reboque

  1. Execute o comando npm install antes de iniciar o servidor.

Então também não está rodando, por favor tente o segundo comando

  1. Remova os módulos do nó e execute o npm install novamente.

Se esses dois pontos não funcionarem, forneça a captura de tela para análise posterior.

Jerrin stephen
fonte
Eu tentei os dois métodos e ambos falharam, o que me levou aqui :( Outro ponto a ser observado é que o pacote continha poucas dependências que tinham vulnerabilidades. Isso poderia ser um motivo? A "instalação do npm" também trava às vezes, mas depois de tentar várias vezes trabalha, eventualmente, os pontos pendurar habituais são "Sill instalar executeActions" e "postinstall: bloqueio verbo usando <caminho para npm cache>"
Kenneth-Rebello
O @ kenneth-rebello fornece as capturas de tela enquanto você executa o comentário inicial do NPM. Se você criar um aplicativo usando create-react-app, os pacotes instalados por este comando não terão nenhuma vulnerabilidade. Você tentou instalar algum pacote?
21445 Jerry Stephenson escreveu
Tendo o mesmo problema e tentei isso em um novo clone e ainda sem sorte.
Simon Long
Também notei que o npm build trava também. Isso sugere que a compilação é o problema. No entanto, não vejo nada no console ou nos logs do npm. Não sei para onde ir daqui sem nada para continuar.
Simon Long
0

Finalmente resolveu isso. Para mim, o problema estava na minha configuração do webpack. Eu tinha um alias do webpack lá, cujo nome alternativo era o mesmo do meu pacote npm.

ou seja, o meu package.jsontinha o seguinte no topo.

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

Dentro do meu webpack.config.jseu tinha

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

Depois que mudei o alias do webpack para o seguinte, tudo funcionou bem

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

Eu tenho algo parecido acontecendo comigo.

Eu tenho um projeto de reação que quero converter para o Typescript e comecei como você notou com o "create-react-app", adicionei todos os meus arquivos e esperei o melhor - mas fiquei como você no "Iniciando o Servidor de Desenvolvimento" " mensagem.

Eu tenho uma memória RAM de 8 GB no Windows 10 e, uma vez que usei o "npm start" padrão pela primeira vez, vi que o processo do nó usa muita memória - tentei oferecer mais e, ao mesmo tempo, cansei de alterar a porta que o reator usa.

  1. Adicionado isso ao script de início no package.json:

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

  2. Fechei todos os meus navegadores Chrome (eles ocupam bastante memória)

  3. E deu cerca de 1 minuto para rodar

Depois de 1 minuto, começou a funcionar e, a partir desse ponto, apenas começou rapidamente e não utiliza tanta memória e não depende da porta que eu escolher

No meu caso - acho que a primeira vez que você executa "npm start" no projeto React Typescript, provavelmente indexa os arquivos (ou faz algo semelhante - não tenho certeza e provavelmente preciso ler sobre isso - sou novo no typescript) ), que exigem muita memória.

No seu caso - pode ser algo semelhante

Espero que ajude :)

Sharon Lifshits
fonte
0

Verifique se suas dependências package.jsonincluem o seguinte:

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

E scripts para ser:

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

Depois de garantir isso, você pode seguir as seguintes etapas:

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

A esperança funcionará para você.

Muhammad Zeeshan
fonte
0

Acredito que você possa ter alguns problemas com o Node e o npm. Eu recomendaria verificar as versões primeiro - você precisará ter o Nó> = 8.10 e npm> = 5.6 na sua máquina e atualizar, se necessário. Vale a pena tentar reinstalar o nó.

A verificação dos logs do nó pode fornecer algumas dicas sobre o seu problema (mais informações sobre como fazer login aqui )

Dan Ovidiu Boncut
fonte
0

Eu também estava tendo o mesmo problema. Tente instalar uma versão anterior do react-scripts.

npm install react-scripts@2.1.8

Espero que isto ajude!

Tayyab Ferozi
fonte
0

teve o mesmo problema, tive que construí-lo primeiro

npm build então npm start

Eu estava executando o react no meu Mac e tive que dar permissão para o terminal interagir com o chrome antes de funcionar.

Bluephlame
fonte
0

Para mim, o problema era que eu tinha .cssarquivos.

Renomeei meus arquivos css para .scsse ele funciona.

Por alguma razão, create-react-app engasga com arquivos CSS para mim.

Esquisito.

Oliver Watkins
fonte