Solución de problemas

danger

En progreso Por ahora, esto es solo una sugerencia sobre cómo lidiar con las especificidades que están surgiendo

Estos son los problemas comunes que puede encontrar al usar WEB SDK y cómo resolverlos.

Si su problema aún no se encuentra aquí o aún necesita ayuda, si ya es cliente o aliado, puede comunicarse con nosotros a través del Centro de Ayuda.

Especificidades por Framework

Angular

Si está utilizando angular, puede ser necesario realizar algunas configuraciones en su proyecto, ya que la lib está en javascript, generando warnings y problemas en el uso porque no está en typescript.

SCREENSHOTS

Para resolver los problemas anteriores, agregue el siguiente código a su archivo package.json:

package.json

{
  "browser": {
    "crypto": false,
    "fs": false
  }
}

SCREENSHOTS

También tiene una configuración más que debe realizarse, el angular se queja sobre el uso de libs en CommonJS o AMD, por esta razón, agregue el siguiente código en su archivo angular.json en la jerarquía de objetos json projects > nombresuprojeto > architect > build > options:

angular.json

"allowedCommonJsDependencies": [
  "unico-webframe"
]

Angular 12 >=

Instale el módulo 'util'

npm install util

Agregue el camino del módulo 'útil' en paths en el archivo tsconfig.json

{
…
"compilerOptions": {
  …
  "paths": {
    "util": ["./node_modules/util"]
   }
},
…
}

Agregue también el módulo 'útil' en allowedCommonJsDependencies en el bloque build dentro del archivo angular.json

angular.json

"build": {
  "builder": "@angular-devkit/build-angular:browser",
  "options": {
    "allowedCommonJsDependencies": [
      “unico-webframe”, “util”
    ]   
...
  }
...
},

Next.js

Si está utilizando Next.js para desarrollar su aplicación, a continuación presentamos algunas orientaciones:

A diferencia de otros frameworks, en Next.js si intenta acceder a un objeto en el campo del browser (Ej.: navigator) fuera de los métodos del ciclo de vida, como componenteDidMount() o useEffect(), se genera un error.

Para corregir el error informado anteriormente, importe los componentes del SDK de la siguiente manera:

useEffect(() => {
  (async () => {
    const {
      UnicoCheckBuilder,
      UnicoThemeBuilder,
      SelfieCameraTypes,
      DocumentCameraTypes
    } = await import('unico-webframe');
  })();
}, []);

Si está utilizando TypeScript en el proyecto, siga las orientaciones en Declaración de tipos para uso en TypeScript. Las digitaciones se pueden importar encima de su componente junto con otras importaciones. Ejemplo:

import ...
import ...
import ...
import ...

import { UnicoTheme, MainView, SuccessPictureResponse } from "unico-webframe";

React con react-scripts 5

Si está utilizando la versión 5 del create-react-app para desarrollar su aplicación, se debe realizar los siguientes pasos:

Instale el módulo 'útil”:

Si su proyecto usa npm:

npm install util

Si su proyecto usa yarn:

yarn add util

Si está utilizando TypeScript en su proyecto, siga la orientación para declarar los tipos que se usan en TypeScript, disponibles en este guía.

Webpack v5

Los react-scripts 5 utilizan Webpack v5, es posible que aparezcan algunas warnings, porque el Webpack v5 no entiende muy bien el uso de módulos de Node.

¿Dudas?

¿No encontró algo o aún necesita ayuda? Si ya es cliente o asociado, puede contactarnos a través del Centro de Ayuda.