vue组件如何发布到npm-tutorial js-php.cn

vue组件如何发布到npm

小云云

Lepaskan： 2017-12-12 14:35:10

asal

1971 orang telah melayarinya

本文给大家讲解一下vue组件发布到npm简单方法和步骤过程，需要的朋友一起学习参考一下，希望能帮助到大家。

1.0 新建项目

1.1 初始化项目
输入npm init，之后需要填什么就写什么

新建src目录，并在src目录下新建alert.vue

$ npm init
$ mkdir src
$ cd src
$ touch alert.vue

Salin selepas log masuk

最后的目录结构

1.2 修改入口文件

打开package.json，并修改

1.3 写组件内容

这个组件内容可以随便写，我们就先测试一下，我是这样写的

<template>
  <p class="alert">
    <p>dddddd</p>
  </p>
</template>

<style>
  .alert {
    color: red;
  }
</style>

<script>

export default {
  name:&#39;vue-x-alert&#39;
}

</script>

Salin selepas log masuk

2.0 注册npm

打开npm官网，注册，并记住注册的账号和密码,npm-url

2.1 登录npm，并发布

$ npm login // 登录
$ npm publish

Salin selepas log masuk

2.3 打开npm，看我们刚刚发布的组件

然后我们要在项目中使用到这个组件，进行npm安装，导入就可以使用了

更新包

修改package.json

"version": "1.1.0",

然后重新发布一下，就可以了

Php8, saya datang juga

Ketahui reka letak tapak web dalam masa 30 minit

Tutorial Video Permulaan Shangguan Oracle kepada Mahir

Baris pertama kod UNI-APP anda

Berkibar dari awal ke pelancaran apl

Tutorial Video Linux Baharu Brother Lian

Tutorial Video AXURE 9 (Sesuai untuk UI Reka Bentuk Produk Interaktif Pengurus Produk)

Tutorial Video PS Kemahiran Asas Sifar

Tutorial video UI 16 hari untuk anda bermula

Tutorial Video Teknik PS dan Teknik Menghiris

Tutorial Video Pembinaan Persekitaran Awan Alibaba dan Pelancaran Projek

Gambaran Keseluruhan Rangkaian Komputer - Pengetahuan Asas yang Perlu Dikuasai Pengaturcara

Tutorial Penting untuk Pengaturcara - Penjelasan Protokol HTTP

Tutorial Video Websocket

vue组件如何发布到npm