html5lib 安装命令,基于vue脚手架构建库并发布到npm

构建库的常见方法有两种：一种是自己手动构建webpack库打包，设置output为 library; 另一种是基于vue-cli3输出库资源包。我们采用第二种vue脚手架的方式构建库。

新增编译库命令// package.json

"scripts": {

// ...

"lib": "vue-cli-service build --target lib --name vcolorpicker --dest dist packages/index.js"

}--name: 库名称。

--target: 构建目标，默认为应用模式。这里修改为 lib 启用库模式。

--dest: 输出目录，默认 dist。

[entry]: 最后一个参数为入口文件，默认为 src/App.vue。

更多详细配置查看 ☛ vue脚手架官网

如果该库依赖于其他库，请在vue.config.js 配置 externals// vue.config.js

module.exports = {

configureWebpack:{

externals: {

vue: 'Vue',

'vue-router':'VueRouter',

axios: 'axios'

}

}

}

执行 npm run lib 就可以发现我们的库被打包到了 根目录的dist文件夹下。

添加 .npmignore 文件(可选)

和 .gitignore 的语法一样，具体需要提交什么文件，看各自的实际情况# 忽略目录

examples/

packages/

public/

# 忽略指定文件

vue.config.js

babel.config.js

*.map

配置npm库信息

配置package.json文件，以发布库文件。{

"name": "gis",

"version": "1.2.5",

"description": "基于 Vue 的库文件",

"main": "dist/gis.umd.min.js",

"keyword": "vue gis",

"private": false,

"files": ["dist"],

"license": "MIT"

}name: 包名，该名字是唯一的。可在 npm 官网搜索名字，如果存在则需换个名字。

version: 版本号，每次发布至 npm 需要修改版本号，不能和历史版本号相同。

description: 描述。

main: 入口文件，该字段需指向我们最终编译后的包文件。

keyword：关键字，以空格分离希望用户最终搜索的词。

author：作者

files: 要上传的文件

private：是否私有，需要修改为 false 才能发布到 npm

license： 开源协议

dependencies： 依赖库

注意每次发布新的库，需要更改版本号，规则如下："version": "1.2.5" 主版本号为 1，次版本号 2，修订号 5主版本号(Major)：当你做了不兼容的API修改

次版本号(Minor)：当你做了向下兼容的功能性新增

修订号(Patch)：当你做了向下兼容的问题修正

登录npm

首先设置登录的npm镜像地址npm config set registry http://168.20.20.57.4873

然后在终端执行登录命令，输入用户名、密码、邮箱即可登录npm login

接着发布库资源到npmnpm publish

最后发布成功可到官网查看对应的包并下载npm install package_name

关于找一找教程网

本站文章仅代表作者观点，不代表本站立场，所有文章非营利性免费分享。

本站提供了软件编程、网站开发技术、服务器运维、人工智能等等IT技术文章，希望广大程序员努力学习，让我们用科技改变世界。

[基于vue脚手架构建库并发布到npm]http://www.zyiz.net/tech/detail-146843.html