- 主篇 npm 上传发布自定义组件以及使用详细流程。
npm login
报错:Unexpected token < in JSON at position 0 while parsing near ‘<!DOCTYPE HTML PUBLI…’。- 登录
npm
$ npm login Username: dengzemiao Password: Email: (this IS public) xxxx@163.com npm notice Please check your email for a one-time password (OTP) Enter one-time password from your authenticator app: 29006106 Logged in as dengzemiao on https://registry.npmjs.org/.
- 检查线上是否存在将要提交的包名,如果有就换个,如果有就会出来信息,如果没有就会报错,说明包名可以用。
$ npm view 包名
- 初始配置文件
$ npm init 或 $ npm init -y
- 新建一个
index.js
文件,可以本地安装到项目中测试使用。附:npm 包本地调试(详细流程:包本地路径、npm link 、yalc)
// 测试属性 export const dzmName = 'dzm' export const dzmAge = 18 // 测试方法 export function dzmFunc (name, age) { return `名字:${name},年龄:${age}` }
- 在新建一个 index.d.ts,也可以通过第三方插件 dts-gen 自动生成。
JS 库必须要提供类型声明文件,才能在 TS环境使用。
类型声明文件的主文件名与JS库文件的主文件名相同,后缀为 d.ts。比如库的文件名为 index.js,则类型声明文件名为 index.d.ts
// 声明测试属性 export const dzmName: string; export const dzmAge: number; // 声明测试方法 export function dzmFunc (name: string, age: number): string;
这样在 ts
文件中就会提示警告了,这里使用的 npm link
本地调试的。
且如果没有 d.ts
声明文件,会报错找不到声明文件
然后通过 Gulp 打包压缩 js 文件到指定目录详细流程(修改文件名与后缀),打包压缩后,进入到 dist
文件夹中去发布
$ npm publish
后面就是正常的安装包使用,注意安装包时如果使用的是非官方镜像,可能会存在延迟,所以推荐官方镜像安装。
# 查看包最新信息 $ npm view dzmtest