微信小程序使用npm安装包

简介: 微信小程序使用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文件。官方有文档如下:

相关文章
|
11月前
|
前端开发 小程序 API
【微信小程序】-- 使用 npm 包 - API Promise化(四十二)
【微信小程序】-- 使用 npm 包 - API Promise化(四十二)
|
11月前
|
资源调度 小程序 前端开发
【微信小程序】-- npm包总结 --- 基础篇完结(四十七)
【微信小程序】-- npm包总结 --- 基础篇完结(四十七)
|
2月前
|
网络协议 Linux 网络安全
docker centos镜像 npm安装包时报错“npm ERR! code ECONNRESET”
通过上述步骤,您可以有效解决在 Docker 中使用 CentOS 镜像安装 npm 包时遇到的 "npm ERR! code ECONNRESET" 错误。希望这些方法能帮助您顺利进行 npm 包的安装。
239 26
|
11月前
|
JSON 小程序 前端开发
小程序中使用npm安装vant组件实现按需引入减少代码包大小,避免触发用户隐私协议
微信小程序按需引入 vant 组件,自动清除项目中未使用的 vant 组件,减少代码包大小,避免因未使用到的 vant 组件触发隐私协议提交审核时被拒
小程序中使用npm安装vant组件实现按需引入减少代码包大小,避免触发用户隐私协议
|
10月前
|
小程序 JavaScript 开发者
微信小程序构建npm
微信小程序构建npm
457 4
|
9月前
|
JavaScript 开发工具
支付系统----微信支付22------初始化Vue项目,npm run serve -- -- port 8888,Vue默认打开是8888的写法
支付系统----微信支付22------初始化Vue项目,npm run serve -- -- port 8888,Vue默认打开是8888的写法
|
11月前
|
小程序
微信小程序启动报错 WXML file not found: ./miniprogram_npm/@vant/weapp/action-sheet/index.wxml
微信小程序启动报错 WXML file not found: ./miniprogram_npm/@vant/weapp/action-sheet/index.wxml
378 3
|
11月前
|
小程序 开发工具 开发者
【微信小程序】微信开发者工具 引用 vant-weapp时“miniprogram/node_modules/@babel/runtime/index.js: 未找到npm包入口文件” 解决办法
【微信小程序】微信开发者工具 引用 vant-weapp时“miniprogram/node_modules/@babel/runtime/index.js: 未找到npm包入口文件” 解决办法
753 1
|
11月前
|
JSON 小程序 前端开发
小程序使用npm以及常用的移动端UI插件
小程序使用npm以及常用的移动端UI插件
82 0
|
2月前
|
自然语言处理 搜索推荐 小程序
微信公众号接口:解锁公众号开发的无限可能
微信公众号接口是微信官方提供的API,支持开发者通过编程与公众号交互,实现自动回复、消息管理、用户管理和数据分析等功能。本文深入探讨接口的定义、类型、优势及应用场景,如智能客服、内容分发、电商闭环等,并介绍开发流程和工具,帮助运营者提升用户体验和效率。未来,随着微信生态的发展,公众号接口将带来更多机遇,如小程序融合、AI应用等。

热门文章

最新文章

推荐镜像

更多