微信小程序如何开发加载npm包？方法介绍

本文介绍了如何在微信小程序开发中使用npm包的功能，大大提高了微信小程序的开发效率，也是微信小程序系列教程的视频版本更新。【相关学习推荐:小程序开发教程】

微信小程序在发布之初并不支持npm，这也是很多前端开发者在熟悉npm生态环境后，对微信小程序诟病的地方。

2.2.1版本后，微信增加了对npm包加载的支持，使得小程序支持使用npm安装第三方包。

微信小程序的功能更新最近也很厉害。比如之前给大家介绍的微信小程序开发平台的新功能“云开发”，可以快速上手。

在applet中加载npm包

微信小程序在这里加载npm包使用的是官方文档。在这个实用的部分，我们加载了一个npm的第三方库，miniprogram-datepicker，用来实现公历和农历的日期选择功能，而微信小程序的官方组件只能简单选择一个公历时间。

在终端中定位微信小程序的项目文件夹，通过npm安装命令进行安装。

这里一定要使用–- production选项，可以减少一些与业务无关的npm包的安装，从而减少整个小包的大小。

构建npm包

点击微信小程序开发工具“工具”菜单下的“构建npm”命令，构建npm包，可以构建成可以在小程序中加载使用的包。

为了帮助您更好地理解npm包版本中提到的各种要求，下面是对该原则的简要介绍:

首先，node_modules目录不会参与编译、上传和打包，所以小程序要想使用npm包，必须经过“构建npm”的过程。在最外层node_modules的peer目录下会生成一个miniprogram_npm目录，这个目录下会存放构建打包好的npm包，也就是小程序实际使用的npm包。

打包有两种:小程序npm包会直接将生成构建文件的目录下的所有文件复制到miniprogram _ npm其他npm包将从入口js文件开始进行依赖性分析和打包过程(类似于webpack)。

查找npm软件包的过程类似于npm的实施，从依赖于npm软件包的文件所在的目录开始，逐层查找，直到找到可用的npm软件包或applet根目录。

构建完成后，还需要确认为项目选中了“使用npm模块”。

在项目中使用第三方模块

在我们之前的实际项目中，我们测试了这个npm模块在主页上的加载。

在页面中布局datepicker，保存并编译项目后，单击按钮查看组件的加载。

有关编程的更多信息，请访问:编程入门！！即如何用微信小程序开发加载npm包？方法详情请关注主机参考其他相关文章！

这几篇文章你可能也喜欢：

• 下面来说说小程序中页面传递参数的几种方式（微信小程序页面传递值）。
• 如何在小程序中实现下拉刷新和上拉加载功能？（附代码）（小程序的上拉加载触发器）
• 如何在小程序中创建页面二维码
• 如何通过applet vant组件将默认样式单元px转换为rpx（Vantui applet）
• 再来说说微信小程序中的生命周期（功能）（请谈谈小程序的生命周期功能？)

本文由主机参考刊发，转载请注明：微信小程序如何开发加载npm包？方法介绍 https://zhujicankao.com/78105.html