crear-reaccionar-aplicación y reaccionar-scripts

react-scripts es un conjunto de scripts del paquete de inicio create-react-app . create-react-app lo ayuda a iniciar proyectos sin configurar, por lo que no tiene que configurar su proyecto usted mismo.

react-scripts start configura el entorno de desarrollo e inicia un servidor, así como la recarga del módulo en caliente. Puedes leer aquí para ver todo lo que hace por ti.

con create-react-app tiene las siguientes características listas para usar.

• Compatibilidad con la sintaxis de React, JSX, ES6 y Flow.
• Extras de lenguaje más allá de ES6 como el operador de extensión de objetos.
• CSS con prefijo automático, por lo que no necesita -webkit- u otros prefijos.
• Un ejecutor rápido de pruebas unitarias interactivas con soporte integrado para informes de cobertura.
• Un servidor de desarrollo en vivo que advierte sobre errores comunes.
• Un script de compilación para agrupar JS, CSS e imágenes para la producción, con hashes y mapas de origen.
• Un trabajador de servicio sin conexión primero y un manifiesto de aplicación web que cumple con todos los criterios de la aplicación web progresiva.
• Actualizaciones sin problemas para las herramientas anteriores con una sola dependencia.

guiones npm

npm start es un atajo para npm run start .

npm run se usa para ejecutar secuencias de comandos que define en el objeto de secuencias de scripts de su paquete.json

si no hay una clave de start en el objeto de scripts, se establecerá de forma predeterminada en node server.js

A veces, desea hacer más de lo que le brindan los scripts de reacción, en este caso puede hacer react-scripts eject . Esto transformará su proyecto de un estado "administrado" a un estado no administrado, donde tiene control total sobre las dependencias, los scripts de compilación y otras configuraciones.

Como señaló Sagiv bg, el comando npm start es un atajo para npm run start . Solo quería agregar un ejemplo de la vida real para aclararlo un poco más.

La configuración a continuación proviene del repositorio de github create-react-app . El package.json define un montón de scripts que definen el flujo real.

 "scripts": { "start": "npm-run-all -p watch-css start-js", "build": "npm run build-css && react-scripts build", "watch-css": "npm run build-css && node-sass-chokidar --include-path ./src --include-path ./node_modules src/ -o src/ --watch --recursive", "build-css": "node-sass-chokidar --include-path ./src --include-path ./node_modules src/ -o src/", "start-js": "react-scripts start" },

Para mayor claridad, agregué un diagrama.

Los cuadros azules son referencias a secuencias de comandos, todas las cuales podría ejecutar directamente con un npm run <script-name> . Pero como puede ver, en realidad solo hay 2 flujos prácticos:

• npm run start
• npm run build

Los cuadros grises son comandos que se pueden ejecutar desde la línea de comandos.

Entonces, por ejemplo, si ejecuta npm start (o npm run start ), eso en realidad se traduce en el npm-run-all -p watch-css start-js , que se ejecuta desde la línea de comandos.

En mi caso, tengo este comando especial npm-run-all , que es un complemento popular que busca scripts que comienzan con "build:" y los ejecuta todos. En realidad no tengo ninguno que coincida con ese patrón. Pero también se puede usar para ejecutar múltiples comandos en paralelo, lo que hace aquí, usando el -p <command1> <command2> . Entonces, aquí ejecuta 2 scripts, es decir, watch-css y start-js . (Esas últimas secuencias de comandos mencionadas son observadores que monitorean los cambios en los archivos y solo finalizarán cuando se eliminen).

• El watch-css se asegura de que los archivos *.scss se traduzcan a archivos *.css .css y busca futuras actualizaciones.

• start-js apunta al react-scripts start que aloja el sitio web en un modo de desarrollo.

En conclusión, el npm start es configurable. Si desea saber qué hace, debe verificar el archivo package.json . (y es posible que desee hacer un pequeño diagrama cuando las cosas se compliquen).

sucintamente - ejecuta esto

 node node_modules/react-scripts/bin/react-scripts.js start