npm的初始化使用,以及带着jsx的npm内容的引用

github上创建示例项目npm-test-demo-byra1n,并clone到本地,不重名就行

在根目录下生成package.json文件:

npm init -y

在根目录下创建.gitignore文件

node_modules
dist
lib

        要是没什么别的需求,就可以装一个webpack之后build,拿来直接用了,完成代码编写之后npm publish即可;如果在发布完成了之后发现下载指定版本还是报错,那可以到npmmirror 镜像站 搜一下自己的包名,然后点击进行同步就可以了。

         下载指定版本的的代码就是npm install npm-test-demo-byra1n@1.0.1

        如果后续要对这个包进行更新的话,需要在改完代码之后,先将改动同步到git,然后npm version patch,再npm publish,然后输入密码和二级校验码就行,这里建议手机装一个微软的校验器,应用商店搜authenticator就行,然后每次输入一次性密码就很方便了。

        这里需要注意的是,npm的包每次发布到镜像站可下载使用有5-10分钟的延迟,这对开发人员很不友好,所以在更改包内代码的时候,更加建议联调本地的npm包,方法也十分简单,在当前代码中npm link生成本地包地址,然后在引用包的地方npm link 地址 就可以测试本地的npm包了。不需要的时候npm unlink 地址就可以了。

       如果只是实现逻辑方法,那这个npm包就算是完成了。但是,如果想要实现像是组件库一样的UI部分,而且不想傻傻的用dom元素一个个创建的话,那就需要引入babel去处理代码中的jsx文件,不然的话jsx语法的内容是没有办法在包之间被解析的。

        在这样的先决条件下,一开始就通过脚手架创建项目会让这一步变得简单,毕竟不需要额外引入打包的modules。只要在根目录下创建.babelrc文件,然后配置以下内容,当然还要install一下babel相关的依赖包。这样,发布的内容就不再是之前的src,而是可以规定为build后dist内的原始js文件。如果不想发一整个的原始js,那通过babel把现有的代码文件做转译了替代现有文件直接发包也是没有什么大问题的。

{
  "presets": ["@babel/preset-env", "@babel/preset-react"],
  "plugins": ["@babel/plugin-transform-runtime"]
}

 应该还有要补充的,等项目完成之后续上。

  • 10
    点赞
  • 5
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值