Web 前端开发 程序员

小程序开发第三方自定义组件简述

2019-02-19  本文已影响8人  叫我徐小星

安装命令行工具

npm install -g @wechat-miniprogram/miniprogram-cli

新建一个空目录,在根目录下执行

miniprogram init --type custom-component

根据命令行提示,完成初始化之后的目录结构如下


image.png

安装依赖、执行命令

npm install
npn run dev

根目录下生产如下两个文件夹,miniprogram_dev文件夹下即为生产的小程序目录结构,可在小程序开发工具上直接打开该目录看到效果


image.png

组件部分写在src目录下,页面应用部分写在tools/demo/pages下
具体写法请参考微信开发文档相关部分

image.png

写完之后npm run dev之后会改变miniprogram_dev,可在小程序开发工具中看到效果。

开发完成后,上传至npm使其变成第三方组件包(在此之前你需要有一个npm账号)
执行npm login之后会要求输入npm的用户名密码和邮箱来登录到npm


image.png

然后执行

npm publish

到此,npm 包就成功发布到 npm 平台了。

我发布了 carouse-component@1.0.0 具体代码可移步我的github

上一篇 下一篇

猜你喜欢

热点阅读