Aprenda la serie de reacción desde 0 - Sección 1: Cree un entorno + cree un proyecto

1. Instala node.js

Primero instale node.js. Después de la instalación, ejecute el comando en la terminal para probar si la instalación es exitosa. Si es exitosa, se imprimirá el número de versión.

$ node -v
$ npm -v
$ npx -v

2. Use create-react-app para inicializar el proyecto

# 其中 npx 是npm附带的package运行工具, react-blog是我们的项目名称
$ npx create-react-app react-blog

Si le indica que la versión de node.js es demasiado baja, solicite node.js14 o una versión posterior, reinstale la versión requerida o use nvm para cambiar a una versión superior. Consulte mi otro artículo
sobre la instalación y el uso de la herramienta de administración de versiones nvm de node.js.

Cuando nvm esté instalado, ejecútelo nvm use 18.12.0. Cambiaré a la versión 18.12 aquí, y puede cambiar según sus necesidades. Ejecute el comando npx create-app nuevamente, le indica que se instalará un paquete, presione Entrar para continuar y espere a que se complete la instalación del paquete.
inserte la descripción de la imagen aquí
Si se ha quedado atascado, puede configurar la fuente npm, consulte mi otro artículo sobre
cómo publicar el paquete npm y el uso de npm

# 设置为淘宝源
npm config set registry=https://registry.npm.taobao.org/

# 查看是否设置成功
npm config get registry

Debido a que hemos ejecutado create-react-app arriba, el proyecto ha sido creado. En este momento, no podemos repetir create, de lo contrario, indicará que el directorio ya existe.
inserte la descripción de la imagen aquí
Debe eliminar el directorio creado anteriormente y ejecutarlo nuevamente

$ rm -rf react-blog
$ npx create-react-blog

crear-reaccionar-aplicación exitosa

3. Ingrese al directorio del proyecto e inicie el proyecto.

Ingrese al directorio de acuerdo con el aviso después de que la instalación sea exitosa e inicie el proyecto con npm start

$ cd react-blog
$ npm start

El terminal indica que el paquete web se compiló correctamente y el navegador se abre automáticamente para acceder a localhost: 3001 (tengo otro proyecto aquí que ocupa 3000, por lo que cambia automáticamente al puerto 3001, y el puerto recién lanzado es 3000), la inicialización del andamiaje del proyecto página mostrada con éxito.
inserte la descripción de la imagen aquí

4. Edite el archivo /src/App.js y guárdelo

Use vscode para abrir el proyecto, edite App.js en el directorio src y los cambios se volverán a cargar automáticamente en la actualización del navegador. Abrimos un nuevo terminal cd al directorio del proyecto, y luego ejecutamos el código.