0.1.1 • Published 4 years ago

wecom-hgc v0.1.1

Weekly downloads
-
License
MIT
Repository
-
Last release
4 years ago

wecom

Project setup

yarn install

Compiles and hot-reloads for development

yarn serve

Compiles and minifies for production

yarn build

Lints and fixes files

yarn lint

打包组件

组件发布到npm上之前,需要进行打包。在 vue-cli4 中我们通过以下命令可以将一个单独的入口打包成一个库:

// target: 默认为构建应用,改为 lib 即可启用构建库模式
// name: 输出文件名
// dest: 输出目录,默认为 dist,这里我们改为 lib
// entry: 入口文件路径
vue-cli-service build --target lib --name lib [entry]

要注意的是在库模式中,打包出来的库中是不包含 Vue 的。 然后我们修改一下 package.json 文件,就像下面这样:

"scripts": {
  "lib": "vue-cli-service build --target lib --name wecom --dest lib packages/index.js"
}

接着执行 npm run lib 就能生成库啦,看看左侧的目录是不是多了个 lib 文件夹,那个就是我们要发布的东西。 补充下,lib 目录下面的 js 之所以有好几种,是因为有两种规范(common 和 umd)、是否压缩(min)和映射(map)的区别,暂且知道有这么回事就行,不用深究。

发布组件

万事俱备,就差发布了。先修改一下 package.json 文件:

{
  "name": "wecom",
  "version": "0.1.0",
  "private": false,
  "main": "lib/wecom.umd.min.js",
  "license": "MIT"
}

在根目录下新建一个 .npmignore 文件,内容和 .gitignore 差不多。

最后执行 npm login 登入最开始注册好的 npm 账号,再执行 npm publish 发布即可,就这么简单的两步就可以,过一会在 npm 上就能搜到了。当然前提是你有个 npm 账号,没有的话去注册一个吧,很 easy 的,然后还要搜下你的 npm 包名是否有人用,有的话就换一个。

更新组件

随着组件的开发迭代,我们会需要更新组件。更新组件流程很简单: 随着组件的开发迭代,我们会需要更新组件。更新组件流程很简单:

打包为npm包

npm run lib

发布npm包

登录(未登录需登录验证npm账号)

npm login

更新版本号(xx.xx.xx)

npm version patch修改版本号最后一位,表示一些补丁和修复
npm version minor修改版本号第二位,表示一个小版本的更新
npm version major修改版本号第一位,表示一个大版本的更新

发布

npm publish

Customize configuration

See Configuration Reference.