npm publica sus propios componentes

Como trabajador de interfaz, puede intentar escribir algunos componentes de la interfaz de usuario usted mismo.

Aunque no es necesario escribir componentes, puede mejorar mejor su capacidad y hacer que su pensamiento sea más completo en el proceso de escritura.

Después de escribir el componente, definitivamente no es posible copiar la carpeta cuando se llama más tarde, lo cual es demasiado bajo. El personal de front-end puede publicar componentes en npm, y luego pueden descargar sus propios componentes con npm install

proceso de lanzamiento de npm

Uno, crea una cuenta npm

sitio web oficial de npm: sitio web oficial de npm

Registrar una cuenta con npm es muy simple, solo necesitas una dirección de correo electrónico, ni siquiera un teléfono móvil

En segundo lugar, cree sus propios componentes

El componente vue que creé, npm init crea un nuevo proyecto
cuando se inicializa npm

• el nombre del paquete representa el nombre del componente futuro
• versión representa el número de versión actual
• La descripción puede describir el componente
• entrt point significa ingresar al archivo, el index.js predeterminado está bien
• palabras clave significa palabras clave
• autor autor
• licencia significa acuerdo, npm usa ISC, el valor predeterminado es correcto

Sale el package.json del proyecto

Tres, configuración de componentes index.js

Después de escribir una parte de los componentes, puede configurar estos componentes en el

código de configuración index.js index.js:

/*
* @author kongchengji
* Date: 2021/2/1
*/
import Vue from 'vue'

import wzc_select from "./select/wzc-select";
import wzc_option from "./select/wzc-option";
import wzc_button from "./button/wzc-button";
import wzc_switch from "./Switch/wzc-switch";
import wzc_slider from "./Slider/wzc-slider";
import wzc_collapse from "./Collapse/wzc-collapse";
import wzc_collapse_item from "./Collapse/wzc-collapse-item";
import wzc_color_picker from "./ColorPicker/wzc-color-picker";
import wzc_timeline from "./TimeLine/wzc-timeline";
import wzc_timeline_option from "./TimeLine/wzc-timeline-option";
import wzc_dividingline from "./DividingLine/wzc-dividingline";
import wzc_picview from "./PicView/wzc-picview"

const components = [
    wzc_select,
    wzc_option,
    wzc_button,
    wzc_switch,
    wzc_collapse,
    wzc_collapse_item,
    wzc_color_picker,
    wzc_slider,
    wzc_timeline,
    wzc_timeline_option,
    wzc_dividingline,
    wzc_picview,
]

const install = function(Vue) {
    
    
    if(install.installed) return
    components.map(component => Vue.component(component.name, component))
    // Vue.prototype.$message = Message
  }
  
  
export default {
    
    
    install,
    wzc_select,
    wzc_option,
    wzc_button,
    wzc_switch,
    wzc_collapse,
    wzc_collapse_item,
    wzc_color_picker,
    wzc_slider,
    wzc_timeline,
    wzc_timeline_option,
    wzc_dividingline,
    wzc_picview,
}

Cuatro, inicio de sesión de terminal en npm y publicar npm

Ingrese a la terminal npm loginpara iniciar sesión.
Ingrese la cuenta, la contraseña y el correo electrónico. La
contraseña no se mostrará cuando la ingrese. Cuando

publique npm, úsela npm publishpara publicar. Una vez que la

publicación sea exitosa, el buzón de correo recibirá una publicación exitosa correo electrónico de forma predeterminada.
En este momento, está en su almacén de npm. Puede ver los componentes liberados en

Cinco, modificación npm

Si el componente es defectuoso y desea modificarlo, npm publishno se olvide de modificar el número de versión cuando presenten después de la modificación, de lo contrario la liberación se producirá un error.

Fallo de emisión