Los problemas, las soluciones y el proceso de desarrollo específico encontrado durante el desarrollo del applet auxiliar de modificación de imagen
Proceso de desarrollo del applet
Confirmación de demanda
Al confirmar la demanda, preste atención a algunas restricciones de WeChat. Aquí están los puntos que encontré.
El tamaño total de la bolsa no supera 1 m.
El número total de páginas no excede de 5
Hay diferentes efectos de API entre el editor y la máquina real (por ejemplo: el editor canvasToTempFilePath no se puede ejecutar)
Solo después de agregar el appid puede haber una función de vista previa y depuración real de la máquina . Sin embargo, en este momento, todas las solicitudes deben configurarse en servidores de terceros .
Andamios delanteros determinados
Razones para elegir andamios
El applet WeChat viene con un editor (el archivo de configuración de actualización en caliente no es compatible, los comentarios no son compatibles, no hay compresión de código ... etc.)
Introducción al andamio
La
Redux
gestión de datos integrada es más convenienteDurante el proceso de desarrollo, el uso del
xml
reemplazo eswxml
más amigable con las herramientas de desarrolloEn el proceso de desarrollo, use
less
reemplazarwxss
, más poderosoIntroducido
es-promise
para que pueda ser creado y utilizadoPromise
Agregue la
promisify
función de herramienta, puede convertir fácilmente el oficialApi
en unPormise
modeloIntroducido para
normalizr
aplanar datos y hacer que la administración de datos sea más convenienteIntroducir conversión
babel
automática deES2015
funcionesLa compresión de wxml / wxss / js / img reducirá el volumen de pérdida en comparación con la compresión proporcionada por las herramientas del desarrollador.
Se recomienda aprender redux
Todos los estados se almacenan en una sola tienda en forma de árbol de objetos.
El único estado cambiante es la acción, que describe lo que sucedió.
Describa cómo las acciones cambian de estado.
Debe convertir los cambios que desea realizar en un objeto normal. Este objeto se denomina acción en lugar de modificar directamente el estado. Luego, escriba una función especial para determinar cómo cada acción cambia el estado de la aplicación. Esta función se denomina reductor.
Desarrollar applet
El documento oficial se puede encontrar en: https: //mp.weixin.qq.com/debu ...
Registro de problemas
Problemas de adaptación móvil
El uso de la unidad de programa pequeño rpx directamente de acuerdo con el dibujo de diseño puede ser equivalente a la versión actualizada de rem
Configuración de color de la barra de título del color del tema
Se puede configurar en app.json
El dibujo del lienzo no puede usar recursos de red y base64, solo archivos locales
Use la API incorporada para almacenar archivos temporales locales para la representación de producción
Interruptor de estilo
1) Puede enlazar directamente una clase o estilo variable 2) Use wx: if wx: else
Faltan algunas carpetas de compilación
Preste atención a si hay un error en la información de compilación
Póngalo en el servidor local y use el applet para abrir el flashback
En la actualidad, el motivo solo se puede ubicar localmente
Este artículo se reproduce en: Ape 2048 → https://www.mk2048.com/blog/blog.php?id=h00c2c2cb0j