El mini programa presenta los pasos detallados de instalación de vant-Weapp y la resolución de problemas

---

Mini programa introducido vant-Weapp

Este artículo no repetirá los pasos de instalación proporcionados por el sitio web oficial y resolverá
los problemas encontrados durante la instalación. Este desarrollo no utiliza servicios de desarrollo en la nube.

---

Sugerencia: El siguiente es el contenido de este artículo, los siguientes casos son para referencia

Uno, crea un pequeño programa

Sugerencia: Creado

Consejo: inicie la terminal

2. Enlace de instalación del sitio web oficial

Empiece rápidamente

Sugerencia: siga los pasos rápidos para instalar, por lo que no entraré en detalles

# 通过 npm 安装
npm i @vant/weapp -S --production
//安装中.....
//安装完成出现.....
+ @vant/weapp@1.6.5
updated 1 package in 41.908s

75 packages are looking for funding
  run `npm fund` for details
bogon:clientWx wyx$

Aviso: siga el sitio web oficial para comenzar rápidamente con la configuración.


Aviso: al compilar npm, se informará un error que indica que no se puede encontrar este archivo

// 在终端输入
$ npm init
// 然后一直回撤就好，如需要配置请自行输入
This utility will walk you through creating a package.json file.
It only covers the most common items, and tries to guess sensible defaults.

See `npm help json` for definitive documentation on these fields
and exactly what they do.

Use `npm install <pkg>` afterwards to install a package and
save it as a dependency in the package.json file.

Press ^C at any time to quit.
package name: (clientwx) 
version: (1.0.0) 
description: 
entry point: (app.js) 
test command: 
git repository: 
keywords: 
author: 
license: (ISC) 
About to write to /Users/wyx/2019RRDF/rrdfFriendWorker/views/clientWx/package.json:

{
  "name": "clientwx",
  "version": "1.0.0",
  "description": "",
  "main": "app.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "author": "",
  "license": "ISC"
}


Is this OK? (yes) 
bogon:clientWx wyx$ 

Consejo: ejecute build npm nuevamente

// 根据错误信息提示执行
$ npm install
npm notice created a lockfile as package-lock.json. You should commit this file.
npm WARN clientwx@1.0.0 No description
npm WARN clientwx@1.0.0 No repository field.

up to date in 0.534s
// 会出现上面的错误，解决办法

Configuración: el contenido del campo de descripción no importa, no está vacío; el segundo permiso se puede configurar como privado. Entonces puede usar el comando de instalación npm normalmente.

// 再次执行
$ npm install
//如执行安装依赖模块命令不出现node_modules包
//再次执行
$ npm i @vant/weapp -S --production

Sugerencia: el paquete de archivos node_modules aparecerá después de la instalación nuevamente

Vuelva a ejecutar y
no se encuentra el miniprograma. Cree un miniprograma en el directorio raíz para resolver este problema.


Mensaje: El mensaje anterior aparecerá después de ejecutar la compilación npm nuevamente.

En tercer lugar, la introducción de la formación.

以 Button 组件为例，只需要在app.json或index.json中配置 Button 对应的路径即可。

所有组件文档中的引入路径均以 npm 安装为例，如果你是通过下载源代码的方式使用 @vant/weapp，请将路径修改为项目中 @vant/weapp 所在的目录。

// 通过 npm 安装
// app.json
"usingComponents": {
    
    
  "van-button": "@vant/weapp/button/index"
}

Consejo: siga el método de inicio rápido para introducir el componente, esta ruta será incorrecta para mí, la solución es el siguiente método

//原举例为
"usingComponents": {
    
    
  "van-button": "@vant/weapp/button/index"
}
//修改正确的为
"usingComponents": {
    
    
	"van-button": "/miniprogram/miniprogram_npm/@vant/weapp/button/index"
}

Sugerencia: Hasta ahora, vant Weapp se puede usar en index.wxml, y la introducción es exitosa.

Algunas de las anteriores no son correctas, avíseme si no es perfecto, preste atención a la evaluación si puede ayudarlo