vue 구성 요소를 npm에 게시하는 방법

이 글에서는 vue 컴포넌트를 npm에 게시하는 간단한 방법과 단계 과정을 설명하겠습니다. 필요한 친구들이 함께 배우고 참고하면 도움이 될 것입니다.

1.0 새 프로젝트

1.1 초기화 프로젝트
npm init를 입력하고 나중에 채워야 할 사항을 입력하세요

새 src 디렉터리를 만들고 src 디렉터리에 새 Alert.vue를 만듭니다

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

마지막으로 디렉터리 구조

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>

2.0 npm 등록

npm 공식 홈페이지를 열고 등록한 후 등록된 계정과 비밀번호를 기억하고 npm-url

2.1 npm에 로그인하여 게시합니다.

$ npm login // 登录
$ npm publish

2.3 npm을 열고 방금 릴리스한 컴포넌트를 살펴보세요

그런 다음 프로젝트에서 이 컴포넌트를 사용하고, npm으로 설치하고, 가져와서 사용해야 합니다.

Update package

Modify package.json

"version": "1.1.0",

그런 다음 다시 게시하면 괜찮을 것입니다

관련 권장 사항:

Vue 구성 요소 옵션 소품

방법 vue 컴포넌트에 배출구

컴포넌트 작성하기 인생을 바꾸세요_Vue 컴포넌트의 미스터리를 밝혀보세요_html/css_WEB-ITnose

위 내용은 vue 구성 요소를 npm에 게시하는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!