微信小程序使用npm安装包

小程序现在支持直接通过npm安装包了,点击这里了解更多。

记录一下我自己的安装步骤及安装过程中遇到的一些问题。希望能够帮助到正在阅读此篇文章的你~

我就直接通过在项目根目录安装miniprogram-datepicker做演示了。

1.在项目根目录下面新建文件夹:node_modules。

在这里插入图片描述

2.终端进入到node_modules文件夹所在的目录

(注意不是node_modules文件夹里面),在此例中就是根目录了。

执行:

cnpm i miniprogram-datepicker -S --production

我这里做了淘宝镜像映射,所以用的cnpm,如果没有做该映射,你就用npm。

在这里插入图片描述

3.安装好之后,勾选 “使用npm模块”

在这里插入图片描述

4.点击开发者工具中的菜单栏:工具 --> 构建 npm

在这里插入图片描述
这一步完成之后你会看到跟node_modules同级多了一个文件夹 miniporgram_npm

在这里插入图片描述

5.直接引用该模块了

因为这个是自定义组件,所以我们在需要使用 datepicker 的页面page.json中添加 datepicker 自定义组件配置:

{
  "usingComponents": {
    "datepicker": "miniprogram-datepicker"
  }
}

我们还可以通过js引入npm包:

const myPackage = require('packageName') //方法一
import { myPackage} from 'packageName' //方法二

6.可能遇到的问题:

1.node_modules文件夹需要自己创建。

2.执行上面第4步,也就是 构建npm 的时候一直提示 找不到node_modules模块。

原因:没有package.json文件。
解决方法

在安装npm包的时候,需要用到 -S,完整的命令语句是 npm install 安装包名字 -S --production。

经测试发现,如果没有添加-S就不会生成package.json文件。官方有文档如下:
在这里插入图片描述

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

嚣张农民

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值