Problemas de implementación del entorno de desarrollo front-end (requerido para programadores avanzados)

inserte la descripción de la imagen aquí

Muchos desarrolladores han llegado a una nueva empresa, y la empresa ha emitido una nueva computadora, y están confundidos acerca de la instalación del entorno. Hoy les mostraré cómo restaurar, obtener la computadora de la empresa y cómo instalar los diversos entornos que necesita.

1. Instalación del nodo

Dirección de descarga del sitio web oficial:

http://nodejs.cn/download/

Descargue la versión correspondiente según sus propias necesidades. Descargué la versión de 64 bits del sistema de Windows.

Para más detalles, consulte el enlace: el nodo sigue el proceso

1. ¿Qué es nodejs?

Un lenguaje de secuencias de comandos necesita un analizador para ejecutarse. JavaScript es un lenguaje de secuencias de comandos, y hay diferentes analizadores en diferentes ubicaciones, como el lenguaje js escrito en html, y el navegador es su función de analizador. Para JS que necesita ejecutarse de forma independiente, nodejs es un analizador. En pocas palabras, node.js es la dirección del sitio web oficial
que se ejecuta en el servidor : http://nodejs.cn/JavaScript

2. Concepto de nodo (tres conceptos principales)

Node.jsEs un entorno de tiempo de ejecución de JavaScript basado en el motor Chrome V8.

Node.jsSe utiliza un modelo de E/S sin bloqueo controlado por eventos.

NodeEs una plataforma de desarrollo que permite ejecutar JavaScript en el servidor.

Controlado por eventos: ejecución de tareas, editor, suscriptor, controlado por eventos (en emisión) Sin bloqueo: mientras se ejecuta una determinada tarea, también se pueden ejecutar otras tareas Bloqueo: ejecutar una determinada tarea, si la tarea no se completa, otras
tareas debe esperar E/S: entrada/salida (operaciones de base de datos, operaciones de sistema de archivos, etc.) Modelo de E/S sin bloqueo:
cuando usamos Node.js para implementar operaciones de base de datos, operaciones de sistema de archivos, etc., las operaciones asincrónicas para ser realizado, el núcleo de las operaciones asincrónicas La implementación tradicional es la función de devolución de llamada

3. Pasos de instalación del nodo

Paquete de instalación oficial de Node.js y dirección de descarga del código fuente: https://nodejs.org/en/download/

Entorno de instalación:Windows7 x64

Pasos de instalación:

Paso 1: haga doble clic en el paquete de instalación descargado " node-v12.13.0-x64.msi" para mostrar la interfaz de bienvenida, como se muestra a continuación:

inserte la descripción de la imagen aquí
Paso 2: Haga doble clic en el archivo descargado node-v12.13.0-x64.msi, aparece la siguiente interfaz, haga clic en Siguiente:
inserte la descripción de la imagen aquí
Paso 3: Marque " I accept the terms in the License Agreement" para aceptar el acuerdo de licencia y haga clic en Siguiente, aparece la siguiente interfaz:
inserte la descripción de la imagen aquí
Paso 4: La ruta de instalación predeterminada de Node .js es " C:\Program Files\nodejs\”, Haga clic en Siguiente,
inserte la descripción de la imagen aquí
Paso 6: Después de confirmar que es correcto, haga clic Nextpara iniciar la instalación:

inserte la descripción de la imagen aquí
Paso 7: Haga clic Installpara iniciar la instalación:
inserte la descripción de la imagen aquí
Paso 8: La página de progreso de la instalación, espere medio minuto para saltar automáticamente a la interfaz de finalización de la instalación:
inserte la descripción de la imagen aquí
Paso 9: Después de medio minuto, la instalación está completa, Finishsimplemente haga clic en:
inserte la descripción de la imagen aquí
Paso 10: Verifique si el nodo se instaló correctamente:
DOS ventana Ingrese node -vo node --versionverifique nodela versión

dos, cnpm

tres, hilo

1. Introducción al hilo:

Yarn es una herramienta de administración de paquetes lanzada por Facebook que reemplaza a npm.

2. Características del hilo

  1. Súper rápido.
  2. Yarn almacena en caché cada paquete descargado, por lo que no es necesario descargarlo nuevamente cuando se usa nuevamente. También utiliza descargas paralelas para maximizar la utilización de recursos, por lo que las instalaciones son más rápidas.
  3. súper seguro
  4. Antes de ejecutar el código, Yarn verificará la integridad de cada paquete de instalación a través de un algoritmo. Súper confiable.
  5. Usando un formato de archivo de bloqueo detallado y conciso y un algoritmo de instalación explícito, Yarn puede garantizar el trabajo indiscriminado en diferentes sistemas.

3. Instalación de hilo:

sistema de ventanas

npm install -g yarn    或者 cnpm install -g yarn 

sistema mac/linux

sudo npm install -g yarn    或者sudo cnpm install -g yarn 

Observación:

Las computadoras Mac deben seguirse con privilegios de administrador, ya que se debe crear un directorio de archivos durante el proceso. Los no administradores no tienen permiso para crear directorios.

Una vez completada la instalación, ingrese el siguiente comando para verificar si la instalación se realizó correctamente

yarn -v

4. Comandos comunes de hilo:

安装包: 

yarn install //安装package.json里所有包,并将包及它的所有依赖项保存进yarn.lock
yarn install --flat //安装一个包的单一版本
yarn install --force //强制重新下载所有包
yarn install --production //只安装dependencies里的包
yarn install --no-lockfile //不读取或生成yarn.lock
yarn install --pure-lockfile //不生成yarn.lock 添加包(会更新package.json和yarn.lock):

yarn add [package] // 在当前的项目中添加一个依赖包,会自动更新到package.json和yarn.lock文件中
yarn add [package]@[version] // 安装指定版本,这里指的是主要版本,如果需要精确到小版本,使用-E参数
yarn add [package]@[tag] // 安装某个tag(比如beta,next或者latest)
//不指定依赖类型默认安装到dependencies里,你也可以指定依赖类型:

yarn add --dev/-D // 加到 devDependencies
yarn add --peer/-P // 加到 peerDependencies
yarn add --optional/-O // 加到 optionalDependencies
//默认安装包的主要版本里的最新版本,下面两个命令可以指定版本:

yarn add --exact/-E // 安装包的精确版本。例如yarn add [email protected]会接受1.9.1版,但是yarn add [email protected] --exact只会接受1.2.3版
yarn add --tilde/-T // 安装包的次要版本里的最新版。例如yarn add [email protected] --tilde会接受1.2.9,但不接受1.3.0

发布包

yarn publish  //移除一个包 
yarn remove <packageName>://移除一个包,会自动更新package.json和yarn.lock

更新一个依赖 

yarn upgrade //用于更新包到基于规范范围的最新版本

运行脚本 

yarn run // 用来执行在 package.json 中 scripts 属性下定义的脚本

显示某个包的信息 

yarn info <packageName>  // 可以用来查看某个模块的最新版本信息

缓存 

yarn cache 
yarn cache list // 列出已缓存的每个包 
yarn cache dir // 返回 全局缓存位置 
yarn cache clean // 清除缓存

安装yarn 
npm install -g yarn
安装成功后,查看版本号: 
yarn --version
创建文件夹 yarn 
md yarn
进入yarn文件夹 
cd yarn
初始化项目 
yarn init // 同npm init,执行输入信息后,会生成package.json文件
yarn的配置项: 
yarn config list // 显示所有配置项
yarn config get <key> //显示某配置项
yarn config delete <key> //删除某配置项
yarn config set <key> <value> [-g|--global] //设置配置项

Cuatro, archivo npm de diferencia de hilo yarn.lock

比如说你的项目中三个模块依赖有依赖关系,@1.2.1代表这个模块的版本。在你安装A的时候需要安装依赖C和D,很多依赖不会指定版本号,默认会安装最新的版本,这样就会出现问题:比如今天安装模块的时候C和D是某一个版本,而当以后C、D更新的时候,再次安装模块就会安装C和D的最新版本,如果新的版本无法兼容你的项目,你的程序可能就会出BUG,甚至无法运行。这就是npm的弊端,而yarn为了解决这个问题推出了yarn.lock的机制,这就是项目中的yarn.lock文件。注意:这个文件不要手动修改它,当你使用一些操作如yarn add时,yarn会自动更新yarn.lock

5. Cambiar la fuente del espejo [nrm]

Dado que la fuente original de npm está en el extranjero, la velocidad de descarga es relativamente lenta, por lo que es mejor cambiar a la fuente de espejo nacional, aquí elija la fuente de espejo de Taobao.

1. Presione instalar nrm

Primero, instalemos nrm, que puede administrar fuentes npm

npm install -g nrm --registry https://registry.npmmirror.com/

nrmDespués de la instalación , puede ver las fuentes disponibles actualmente con el siguiente comando

nrm ls

Ejecución de resultados:
inserte la descripción de la imagen aquí
2. Establezca la fuente de espejo de npm

1. Ver la fuente espejo actual de npm

npm config get registry

inserte la descripción de la imagen aquí
2. Configure npm para usar la fuente de espejo Taobao

npm config set registry https://registry.npmmirror.com/

La dirección de la fuente espejo https://registry.npmmirror.com/Taobao aquí se
obtiene copiando la dirección detrás de taobao de la fuente disponible actual a través del comando nrm ls anterior, y puede cambiar otras fuentes espejo de la fuente disponible actualmente por sí mismo

inserte la descripción de la imagen aquí
inserte la descripción de la imagen aquí
Mientras persistas, no serás eliminado.

Supongo que te gusta

Origin blog.csdn.net/weixin_52703987/article/details/131193724
Recomendado
Clasificación