想要在npm上快速发包?用vue-sfc-rollup工具即可&细致图解操作流程

lxf2023-04-14 07:10:01

问题描述

需求描述

本文记录了使用vue-sfc-rollup工具,去将我们封装的vue组件,发到npm上,以便于组件共享。

就npm发包而言,工具有很多,不过vue-sfc-rollup是一个轻量级的工具,能够快速完成发包需求

vue-sfc-rollup介绍

官话介绍:

vue-sfc-rollup is a CLI templating utility that scaffolds a minimal setup for compiling a Vue Single File Component (SFC) - or library of multiple SFCs - into a form ready to share via npm. It doesn't assume any particular flavor of CSS or docs generator, so you can use what you're already used to. It's the fastest way to produce npm-ready vue components!

通俗解释说明:

vue-sfc-rollup是一个脚手架模板工具,在vue语法中生产,制作,发布npm包,是最快的方法

  • NPM包地址:www.npmjs.com/package/vue…
  • GitHub地址:github.com/team-innova…

步骤记录

第一步,准备好要发布的组件

假设我有一个组件,名字叫做myStar,就是一个盒子中放置三颗星星,长相如下图:

想要在npm上快速发包?用vue-sfc-rollup工具即可&细致图解操作流程

代码如下:

<template>
  <div class="myStarWrap">
    <span class="starItem">✡️</span>
    <span class="starItem"></span>
    <span class="starItem">