• 设为首页
  • 点击收藏
  • 手机版
    手机扫一扫访问
    迪恩网络手机版
  • 关注官方公众号
    微信扫一扫关注
    公众号

uni-app项目使用npm包中的小程序自定义组件

原作者: [db:作者] 来自: [db:来源] 收藏 邀请

原理

1. postinstall 时将 `node_modules` 下的小程序组件包复制到 `wxcomponents` 目录下

2. 第三方包建议只用 `package.json` 管理,所以将代码加入 .gitignore 中

 

核心代码

// scripts/pkg-copy.js
//
本脚本用于将原生 npm 组件复制到 wxcomponents 文件夹 const fs = require('fs-extra') const path = require('path') // 需要复制的包 const pkgList = [ { from: 'some-mp-component/miniprogram_dist', to: 'my-mp-component' } ] const npmPath = path.join(__dirname, '../node_modules') const distPath = path.join(__dirname, '../src/wxcomponents') function copyPkg (pkg) { const from = `${npmPath}/${pkg.from}` const to = `${distPath}/${pkg.to}` fs.copySync(from, to) }

 

然后在 package.json 配置 postinstall 命令。这样在 npm install 之后就会自动复制该包到 `wxcomponents`

  "scripts": {
    "postinstall": "node scripts/pkg-copy"
  },

配置 .gitignore

src/wxcomponents/my-mp-component

 

总结

简单的使用第三方 npm 包配置就完成了,注意此种方法只适用于第三方包的自定义组件的 json 文件中没有其他依赖的情况下。

如果需要处理有其他依赖的小程序自定义组件,需要考虑依赖解析的方案。

 

笔者也在研究这块,可以继续关注本博客哦~


鲜花

握手

雷人

路过

鸡蛋
该文章已有0人参与评论

请发表评论

全部评论

专题导读
上一篇:
微信小程序使用session时注意的问题--摘抄发布时间:2022-07-18
下一篇:
微信小程序自定义tab,多层tab嵌套实现发布时间:2022-07-18
热门推荐
阅读排行榜

扫描微信二维码

查看手机版网站

随时了解更新最新资讯

139-2527-9053

在线客服(服务时间 9:00~18:00)

在线QQ客服
地址:深圳市南山区西丽大学城创智工业园
电邮:jeky_zhao#qq.com
移动电话:139-2527-9053

Powered by 互联科技 X3.4© 2001-2213 极客世界.|Sitemap