@reboot-wc/create v0.38.69
permalink: 'init/index.html' title: Crear Web Components section: guides tags:
- guides
Crear Web Components
Andamiaje para proyectos en Web components
Usage
npm init @reboot-wc
Éste proceso iniciara un menú guiado através de todas las opciones disponibles
$ npm init @reboot-wc
npx: installed 14 in 4.074s
██████╗ ███████╗██████╗ ██████╗ ██████╗ ████████╗
██╔══██╗██╔════╝██╔══██╗██╔═══██╗██╔═══██╗╚══██╔══╝ Open Web Components
██████╔╝█████╗ ██████╔╝██║ ██║██║ ██║ ██║
██╔══██╗██╔══╝ ██╔══██╗██║ ██║██║ ██║ ██║
██║ ██║███████╗██████╔╝╚██████╔╝╚██████╔╝ ██║ Estándares para un desarrollo web moderno más rápido
╚═╝ ╚═╝╚══════╝╚═════╝ ╚═════╝ ╚═════╝ ╚═╝
Ctrl+C or Esc para salir
¿Que deseas hacer? › - Utiliza las flechas. Enter para selecionar.
❯ Crear andamio arquetipo para un nuevo proyecto
Actualizar un proyecto existente
Opciones
Se pueden pasar parametros para saltarse las preguntas del wizard parcialmente o en su totalidad
Option | Type | Description | |
---|---|---|---|
--destinationPath | path | La ruta donde el generador escribirá los archivos to | |
--type | scaffold |upgrade | scaffold para crear un andamio en un nuevo proyecto o upgrade para actualizar un proyecto existente | |
--scaffoldType | wc |app | El tipo de proyecto a crear el andamio. wc para un componente simple o app para una aplicación | |
--features | linting |testing |demoing |building | Qué características incluir. linting, testing, demoing, o building | |
--typescript | true |false | Si se desea utilizar TypeScript en el proyecto | |
--tagName | string | La etiqueta para el web component o elemento shell | |
--installDependencies | yarn |npm |false | Si se desea instalar dependencias. Elegir npm o yarn para instalarlas o false para saltar la instalación | |
--writeToDisk | true |false | ¿Escribir los archivos al disco? | |
--help | Este mensaje de ayuda |
Generador de Andamio
Éste generador te ayuda a iniciar una nueva app o web component. Creará una nueva carpeta y configurará todo lo necesario para iniciar inmediatamente.
Ejemplo de uso:
npm init @reboot-wc
# Seleccionar "Andamiar un nuevo proyecto"
Generadores de Andamio disponibls:
Web Component
Este generador crea un andamio inciial de proyecto para crear un web component. Se recomienda cuando se desea desarrollar y publicar un componente individual.Application
Este generador crea un andamio inicial de proyecto para crear una aplicación. Se recomienda cuando se desea iniciar un proyecto basado en web components
Características
Los generadores anteriores son el campo de juego ideal para prototipar. Se puede agregar linting, testing, demo y building cuando sea necesario.
Ejemplo de uso:
cd existing-web-component
npm init @reboot-wc
# seleccionar "Actualizar un proyecto existente" o agregar características mientras se realiza el andamio
Características dispponibles para actualización
Linting
Este generador agrega una configuracion completa de lintin con ESlint, Prettier, Husky y commitlintTesting
Este generador agrega una configuración completa de pruebas con Web Test Runner y PuppeteerDemoing
Este generador agrega una configuración completa con StorybookBuilding
Este generador agrega una configuración crompleta con Rollup