La guia de platanus
  • README
  • Acuerdos
    • Guía de Estilo
      • Ejemplo: Módulo para variables de entorno
  • Stack
    • Getting Started
    • Nuestro MVC extendido
    • Ruby/Rails
      • Power Types
        • General
        • Patrones
          • Commands
          • Utils
          • Services
          • Values
          • Observers
      • Potassium
      • Power API
      • Active Admin
        • General
        • Active Admin Addons
      • Pundit
      • Shrine
        • General
        • Manejo y procesamiento de imágenes
      • Pry
      • Strong Migrations
      • Data Migrate
      • Active Job
      • Gems
      • Engines - Modularización en Rails
    • JavaScript
      • Vue
        • General
        • Testing
      • AlpineJS
    • CSS
    • Mobile
      • Expo
      • React Navigation
      • Redux
        • Crear y conectar una slice en Redux
      • Styling
        • Usando Tailwind en React Native
      • Recursos
    • Resolviendo problemas (debugging)
    • Machine Learning
  • Setup
    • Configuración de tu entorno local
      • Instalación Base
        • OSX
        • Windows
        • Linux
      • Tecnologías
        • Ruby
        • Docker
        • Node
      • Herramientas
        • Linters
        • Editores
          • IDE/Editores de Código
            • Visual Studio Code
            • Sublime Text
        • Git
    • Configuración de proyectos
      • Getting Started
      • Heroku
      • Rails
      • Circle CI
      • Vue
      • Apple App Store
      • Google Play
      • Expo
      • S3
      • Git
      • Cloudflare
      • Sendgrid
      • Dominio + Mailing
      • Google Tag Manager, Analytics, Search Console, etc.
        • Google Tag Manager
          • Configurar Google Tag Manager
        • Google Analytics
        • Indexación en Google
        • Google Ads
      • Crear un bucket de S3
      • SlackBot
      • Google BigQuery
  • Deployment
    • Rails
    • Ruby Gems
    • Browser and Node (Open Source)
    • Mobile
      • Mobile Resources
      • Apple App Storage
      • Google Play
  • Upgrades
    • Upgrade de Vue 2 a Vue 3
    • Migración Hound → reviewdog
    • Upgrade de Postgresql
Con tecnología de GitBook
En esta página
  • Crear el paquete
  • package.json
  • Dependencias
  • ES6 vs CommonJS export sintaxis
  • Comandos de consola personalizados para funciones del paquete
  • Publicación
  • NPM
  1. Deployment

Browser and Node (Open Source)

AnteriorRuby GemsSiguienteMobile

Última actualización hace 2 años

Siempre que crees una nueva librería invierte tiempo en buscar un buen nombre (compártelo con el equipo)

Crear el paquete

Primero, . Asegúrate de que sea público.

Luego puedes crear el paquete con npm init, el cual te preguntará algunos detalles del paquete, o crear manualmente un package.json.

package.json

En el archivo package.json debemos llenar al menos los siguientes campos.

//restmod package.json example
{
  "name": "angular-restmod",
  "description": "API Bound Models for AngularJS",
  "version": "1.11.1",
  "dependencies": {
    ...
  },
  "devDependencies": {
    ...
  }
}

Puedes agregar como autor a Platanus y a ti como colaborador:

"author": {
    "name": "Platanus",
    "url": "https://platan.us"
  },
"contributors": [
  {
    "name": "Tu nombre"
  }
],

Dependencias

Al menos deberías instalar las siguientes dependencias:

  • jest: Testing

  • eslint-plugin-import: Permite utilizar el linter para revisar sintaxis de import/export.

Opcionalmente, puedes instalar:

  • eslint-plugin-jest: en caso de no instalarlo reemplazar jest/globals en env de .eslintrc.json por solo jest.

ES6 vs CommonJS export sintaxis

Si estamos desarrollando un paquete de Node (y no de web) debemos usar la sintaxis de CommonJS para imports/exports:

// lib.js
module.exports = {
  funcionLib
}
// otro.js
const lib = require('./lib')

Se puede utilizar esta sintaxis manualmente o utilizar la sintaxis de ES6 y luego compilar con un bundle como webpack para que la librería quede en formato CommonJS.

Comandos de consola personalizados para funciones del paquete

Para correr algún archivo con un comando personalizado se deben seguir los siguientes pasos:

  • Crear un archivo cli.js o una carpeta cli con archivos que queremos que se ejecuten.

  • Al principio de estos archivos colocar:

    #!/usr/bin/env node
  • En package.json agregar una sección de:

    "bin": {
      "nombre-comando-cli": "archivo.js",
      "nombre-comando-cli-2": "archivo2.js",
    }

Correr npm link (permite simular la instalación del paquete), reiniciar la terminal y probar corriendo alguno de los comandos creados. Si se modifica alguno de los archivos javascript no es necesario volver a correr npm link.

Publicación

NPM

Si no has iniciado sesión en tu cuenta desde tu terminal, corre:

npm login

En NPM debes registrar el paquete y publicar directamente cada versión.

npm publish

IMPORTANTE: Las publicaremos con nuestro usuario personal pero debemos agregar como owner al usuario de platanus.

# Agregar un owner a un package
npm owner add platanus-owner <package-name>

eslint: Linter. Puedes copiar las que vienen en Potassium. Puede ser necesario eliminar las reglas relacionadas a Vue y Tailwind si no serán utilizados.

Los paquetes deben ser publicados en . Si no la tienes, deberás crearte una cuenta personal.

crea un repositorio en Platanus
reglas
NPM