创建项目
打开命令窗口,创建一个项目文件
mkdir learnjts // 创建了一个名为 learnjts 的文件夹 cd learnjts // 进入此文件夹
然后初始化项目
npm init
我们可以看到:让我们给项目起一个名字,括号内是默认文件夹的名字,不用修改,回车就可以
还会弹出来许多的参数,我们可以写上,也可以一路回车,一直到最后,就会生成一个package.json
文件夹
如果要修改可以直接在这里修改
创建一个src
文件夹,里面放一些js文件,可以写工具方法,再在根目录下创建一个index.js
作为入口文件
写工具方法
项目骨架已经建好了,接下来我们开始写工具方法
第一个工具方法,我写了一个数据类型的判断方法
先在src文件夹下面建一个getDataType.js
function getDataType(target){ let type = typeof target // 判断是否是复杂数据类型 if(type === 'object'){ return Object.prototype.toString.call(target).replace(/^[object (\S+)]$/, '$1').toLowerCase(); }else{ // 基础数据类型直接返回 return type } } //导出这个方法 export default getDataType
然后在index.js文件里导入 getDataType
方法,并且验证是否能够使用
然后就会发现,报错了
从报错信息我们可以看到是 import出错了
解决方案:给package.js
添加一个属性
"type":"module",
此时再运行一下可以看到,能够正常运行了
以后我们在src目录下肯定会增加很多工具函数,所以可以吧index.js
当成一个入口,所有的工具函数都可以从这里导出出去
import getDataType from './src/getDataType.js' export { getDataType, }
注册npm账号
要想自己的工具库别人也能够使用,需要把它发到npm上 npm官网
此时就需要注册一个npm账号了
注册npm需要有一个邮箱,任何邮箱都可以,能接收到验证码就可以,注册时会收到验证码
开始发布
当你注册好npm账号后,你就可以去项目中准备 发布 了
设置npm源
但是在发布之前,需要检查一下npm源,如果是其他源,就会发布失败,此时你需要把它设置为npm源
在项目终端里输入npm config get registry
,可以查看当前源
npm config get registry
可以看到此时我的源是npm源,可以发布,如果是淘宝源呢?
就需要设置npm源
npm config set registry https://registry.npmjs.org/
登录npm账号
因为我们是第一次发布包,所以需要在终端登录我们的npm用户,输入我们的用户名,和密码和邮箱
在终端输入
npm adduser
需要注意的是,我们输入密码时,不会再终端上显示出来,输入完直接按回车就好
接着开始让你输入npm的邮箱号,再次按回车时,会给你的邮箱发一个验证码,你需要把这个验证码再输入上
发布到npm上
登录好后,开始发布,在终端输入
npm publish
发布的时候,有可能就会报错:提示信息就会问你:你没有登录对账号吧?
其实真正的错误原因:是因为你的项目名称和npm上的项目重名了
在起名字的时候,你可以去npm上搜一下
嘿嘿^_^ 这个其实是我之前写好的,只是为了给大家演示,又从零搭建又写了一遍
如果没有搜到,则说明你可以使用这个名字
如果你重名了,你就在package.js
里面改名吧
此时再次发布,就可以看到,发布成功了
回到npm,点击自己的头像,再点击Profile,就可以看到自己的npm库了