美文网首页工作生活
在npm上 发布自己的包

在npm上 发布自己的包

作者: 林木酸瓜 | 来源:发表于2019-07-02 15:01 被阅读0次

一、为了方便创建项目,需要安装vue-cli, 使用npm 安装!

使用命令vue init webpack-simple bc_utils or vue init webpack bc_utils, bc_utils 为项目名称!webpack-simple 适用于小型项目,中大型项目使用webpack!

二、 初始化项目并上传至git!

  1. git 创建好仓库
    mv bc_utils bc_utils1 因为本地与git项目重名,先改一下名字。
  2. git clone ... 捡出空仓库
  3. 将本地项目的文件拷贝到仓库中。
    cp bc_utils1/. bc_utils
  4. 将所有文件添加至git
    • git add .
    • git commit
    • git push
  5. 打个响指,ok了!

三、发布

1. 查看已经登录的npm 账号

npm whoami
如果提示

npm ERR! code ENEEDAUTH
npm ERR! need auth this command requires you to be logged in.
npm ERR! need auth You need to authorize this machine using `npm adduser`

说明还未登录账号!

2. 登录账号

登录账号之前先查看一下npm的源,有些同学已经将源改为淘宝的,发布时,先改回npm默认的来
npm config get registry
如果显示https://registry.npmjs.org/则正确,否则
npm config set registry https://registry.npmjs.org/

接下来~
npm adduser
要求输入

Username: xiaolin
Password: bc88888
Email: 1234567@qq.com

只是举个例子:等到提示Logged in as xiaolin on https://registry.npmjs.org/. 这个时候就是成功登录了!

3. 要发布的组件

npm publish

npm ERR! publish Failed PUT 403
npm ERR! code E403
npm ERR! you must verify your email before publishing a new package: https://www.npmjs.com/email-edit : bc_utils

这种情况下要先验证账号!

{
"name": "bc_utils",
  "description": "baichuan's tools!",
  "version": "1.0.0",
  "main": "index.js",
  "author": "chelin <chelin>",
  "license": "MIT",
  "private": false,
  "scripts": {
    "dev": "cross-env NODE_ENV=development webpack-dev-server --open --hot",
    "build": "cross-env NODE_ENV=production webpack --progress --hide-modules"
  },
  "dependencies": {
    "vue": "^2.5.11"
  },
  "browserslist": [
    "> 1%",
    "last 2 versions",
    "not ie <= 8"
  ],
  "devDependencies": {
    "babel-core": "^6.26.0",
    "babel-loader": "^7.1.2",
    "babel-preset-env": "^1.6.0",
    "babel-preset-stage-3": "^6.24.1",
    "cross-env": "^5.0.5",
    "css-loader": "^0.28.7",
    "file-loader": "^1.1.4",
    "vue-loader": "^13.0.5",
    "vue-template-compiler": "^2.4.4",
    "webpack": "^3.6.0",
    "webpack-dev-server": "^2.9.1"
  }
}

小提示: private这个字段一定要设置为false哦~
首先大家理解一下package.json 中 main字段的意思。
main这个字段只有发布的时候,才会用到,平时可以删掉! main的值是包里面你要发布的文件路径。

比如bc_utils文件夹下有个index.js!

const  name = 'xiaolin';
export default name;

那么安装完包之后,引用:

import bc_utils from 'bc_utils';

那么bc_utils 的值就是字符串'xiaolin'
👌理解其中原理了么!!!

相关文章

  • 在npm上 发布自己的包

    一、为了方便创建项目,需要安装vue-cli, 使用npm 安装! 使用命令vue init webpack-si...

  • 在npm上发布包

    首次发表在个人博客 在npm上发布自己的包 发布包 1.创建你要发布的包 /lib/test.js index.j...

  • 发布自己的包到npm上

    三步完成npm包的发布,还有操作过程中可能 会遇到的坑,以及解决办法都列出来了。 第一步 创建 npm账号,地址 ...

  • 向npm上发布自己的包

    登录npm官网先注册个账户 在控制台关联npm账号,输入刚刚注册的账号、密码 写好package.json、REA...

  • 在npm发布自己的angular包

    2018-01-09 更新 整理思路重写一篇,点此跳转。 2017-09-28 更新 将ng2更改为angular...

  • npm发布自己的npm包及使用

    [TOC] ### 1.npm 发布自己包到npm平台 1.下载安装node js 注意:发布包的名字不能跟npm...

  • 小程序开发本地npm的使用

    开发中复用的代码通常会封装成npm包,发布到npm源,项目中再依赖这个包。如果包的源码改动,需要先发布到npm上再...

  • 自定义npm包的创建、发布、更新和撤销

    大纲 1、准备2、自定义npm包3、发布自定义npm包4、引用npm包5、更新npm包6、撤销发布的npm包 博客...

  • vue.js源码构建

    发布在npm上每个包都有对应的package.json图片.png

  • 发布自己的 npm 包

    开始 安装node和npm去 http://nodejs.org下载nodejs,同时就安装了npm 检查npm是...

网友评论

    本文标题:在npm上 发布自己的包

    本文链接:https://www.haomeiwen.com/subject/cqvacctx.html