How to publish vue components to npm

Let me explain to you the simple method and step process of publishing vue components to npm. Friends who need it can learn and refer to it together.

1.0 Create a new project

1.1 Initialize the project
Enter npm init, and then fill in whatever you need

Create a new src directory, and create a new alert in the src directory. vue

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

Final directory structure

##1.2 Modify the entry file

Open package.json , and modify

1.3 Write component content

You can write the content of this component as you like, let’s test it first, I wrote it like this

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

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

<script>

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

</script>

2.0 Register npm

Open npm official website, register, and remember the registered account and password, npm-url

2.1 Log in to npm and publish

$ npm login // 登录
$ npm publish

2.3 Open npm and look at the component we just released

Then we want to use this component in the project, install it with npm, and import it You can use it

Update package

Modify package.json

"version": "1.1.0",

The above is what I compiled for everyone , I hope it will be helpful to everyone in the future.

Related articles:

How to implement a drop-down menu in jQuery

How to use route parameter passing in vue

How to use two-way binding in AngularJs

How to implement the breadcrumb navigation function

The above is the detailed content of How to publish vue components to npm. For more information, please follow other related articles on the PHP Chinese website!