Desarrollo de frontend

Se requieren conocimientos de manejo de node/npm.

Las dependencias del frontend de GeoNode se pueden encontrar en ./geonode/static. Para administrar las dependencias, recomendamos utilizar el administrador de paquetes yarn (https://yarnpkg.com/lang/en).

Primeros pasos:

yarn install

Instala las bibliotecas necesarias en ./node_modules

yarn install <package>@version [--dev]

Instala un paquete con una versión definida. El uso de –dev instala una dependencia que solo está disponible para el proceso de compilación (consulte: package.json devDependencies).

yarn remove <package>

Elimina un paquete.

yarn outdated

Muestra información de la versión.

yarn why <package>

Obten información sobre por qué se instaló este paquete.

Para obtener más información sobre cómo instalar o usar Yarn, visita la documentación oficial.

Descripción general de archivos/carpetas:

./static_dependencies.json

incluye todas las dependencias asociadas con cada archivo. Por ejemplo, todos los archivos que se deben minimizar a assets.min.js se nombran como valores. Todos los archivos que se deben copiar a la carpeta lib (para DEBUG_STATIC) son valores de la clave other_dependencies y así sucesivamente. Antes de poder usar una dependencia, se debe agregar a package.json mediante el uso de yarn.

./Gruntfile.js

lee las dependencias desde static_dependencies.json y contiene todos los flujos de trabajo.

geonode/static/geonode

La carpeta ./geonode contiene las hojas de estilo y los archivos javascript de GeoNode. Los archivos CSS se generan mediante less. Por lo tanto, los archivos CSS nunca deben modificarse directamente, sino el archivo less correspondiente. Además, ¡esta carpeta nunca debe eliminarse!

geonode/static/lib

La carpeta ./lib contiene todos los archivos de terceros. Esta carpeta se puede eliminar, ya que se generará completamente mediante el uso de grunt development|production

Ejemplo 1 – Cambiar estilo:

  1. En la configuración, configura DEBUG_STATIC=True. Esto cargará los activos no minimizados en tu plantilla.

  2. Inicia el servidor de desarrollo con paver start.

  3. Utiliza grunt watch para vigilar todos los archivos less en busca de cambios.

  4. Cambia el estilo en ./geonode/static/geonode/less

  5. Si nuestros cambios son los esperados, crea una nueva compilación con grunt development (los archivos no se minimizan) o grunt production (los archivos se minimizan)

Ejemplo 2: agregar/actualizar una nueva biblioteca:

  1. En la configuración, configura DEBUG_STATIC=True. Esto cargará los activos no minimizados en tu plantilla.

  2. yarn add angular@1.7

  3. vim static_dependencies.json Edita el archivo y agrega su dependencia al destino correspondiente. Por ejemplo, assets.min.js

  4. Comprueba si alguna plantilla de Django (por ejemplo, base.html) incluye el archivo y agrégalo o ajusta la versión

  5. utiliza grunt production para construir el paquete

Para más tareas, consulte gruntfile.js o solicite ayuda en la lista de correo de desarrollo

Nota

Facilita el trabajo de los encargados del mantenimiento y agrega un mensaje a tu confirmación indicando por qué se agregó una biblioteca. (Por ejemplo, commit -m “select2 added for permissions form on layer detail page”)