微信小程序使用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' //方法二
然而。。。。。
我发现我引用的时候报错。。。。
这个问题我还未解决。。。如果有知道解决方案的,望告知。不甚感激~
官方有文档如下:
所以我觉得它应该会自己找这个模块,一直到根目录。但是事实没有,我不知道是不是我理解错了。。。
-----12.26补充-----
出现上面这个问题是因为我用的cnpm安装包,不能用cnpm,只能用npm。
详情可查看:npm安装包引用提示找不到该模块
-----//12.26补充-----
接下来说下遇到的问题:
1.node_modules文件夹需要自己创建。
2.执行上面第4步,也就是 构建npm 的时候一直提示 找不到node_modules模块。
原因:
没有package.json文件。
解决方法:
在安装npm包的时候,需要用到 -S,完整的命令语句是 npm install 安装包名字 -S --production。
经测试发现,如果没有添加-S就不会生成package.json文件。官方有文档如下:
微信小程序使用npm安装包的更多相关文章
- 微信小程序使用npm安装第三方库
微信小程序在 2.2.1 版本后增加了对 npm 包加载的支持,使得小程序支持使用 npm 安装第三方包. 之前在微信开发者工具选择“构建npm”会报错“没找到node_modules”目录”,这是因 ...
- 微信小程序 - 使用npm(第三方包)
使用示例: 1. 开启“使用npm模块” 2. 新建 node_modules 文件夹 3. cd到新建 node_modules 所在的目录(非node_modules文件夹内) npm insta ...
- 微信小程序开发教程 #043 - 在小程序开发中使用 npm
本文介绍了如何在微信小程序开发中使用 npm 中包的功能,大大提高微信小程序的开发效率,同时也是微信小程序系列教程的视频版更新. 微信小程序在发布之初没有对 npm 的支持功能,这也是目前很多前端开发 ...
- 原生微信小程序脚手架(支持npm)
微信小程序支持npm 为了支持生态扩展,社区贡献者可以提供更加丰富的功能,已经支持了第三方小程序开发功能,见如下地址. 微信小程序支持npm https://developers.weixin.qq. ...
- 使用gulp构建微信小程序工作流
前言 刚入门微信小程序的时候,一切都基于微信web开发者工具,没有使用其他框架,也没有工程化的概念.当时做的项目都比较简单,单单用微信web开发者工具倒也得心应手.学了些东西后,就按捺不住地想跳出原生 ...
- 微信小程序导入Vant报错
作者:如也_d1c0链接:https://www.jianshu.com/p/0d2332984f8c来源:简书简书著作权归作者所有,任何形式的转载都请联系作者获得授权并注明出处. 先放出来Vant ...
- 微信小程序没找到构建npm或者没找到node_modules目录以及如何在小程序中引入vant weapp组件
微信小程序没找到构建npm或者没找到node_modules目录解决方法如下: 按照微信小程序提供的文档npm install是不行的,直接提示没找到可构建的npm包. 1.直接安装:npm init ...
- 微信小程序没有找到可以构建的npm包
如果是云开发小程序 ,cmd窗口进入到小程序根目录下的miniprogram目录, 输入npm init 输入包的相关属性,随便输入即可. 完成后会出现一个package.json文件. 如果是其他类 ...
- 微信小程序中使用 npm包管理 (保姆式教程)
打开自己的微信小程序项目,在勾选这个选项 然后在第一次应该是失败的提示"没有找到可以构建的npm包". 在 小程序的根目录下比如我的项目如图: 右击鼠标在终端中打开. 然后输入:n ...
随机推荐
- Java基础-对象的内存分配与初始化(一定要明白的干货)
首先,什么是类的加载?类的加载由类加载器执行.该步骤将查找字节码(classpath指定目录),并从这些字节码中创建一个Class对象.Java虚拟机为每种类型管理一个独一无二的Class对象.也就是 ...
- BZOJ4855 : [Jsoi2016]轻重路径
首先用树状数组维护dfs序来快速支持一个点子树大小的询问. 每次删掉一个叶子时,从根开始往叶子走,显然只有$2size[x]\leq size[father]$的点的父亲才有可能换重儿子. 从根开始往 ...
- bzo1606: [Usaco2008 Dec]Hay For Sale 购买干草
1606: [Usaco2008 Dec]Hay For Sale 购买干草 Time Limit: 5 Sec Memory Limit: 64 MBSubmit: 1338 Solved: 9 ...
- Mac配置本地hadoop
Mac配置本地hadoop 这学期要学习大数据,于是在自己的mac上配置了hadoop环境.由于Mac是OSX系统,所以配置方法跟Linux类似 一.下载hadoop 从官网下载压缩包. $ll to ...
- UVALive - 4885 Task 差分约束
Task 题目连接: https://icpcarchive.ecs.baylor.edu/index.php?option=com_onlinejudge&Itemid=8&page ...
- 超级牛皮的oracle的分析函数over(Partition by...) 及开窗函数 (转)
http://zonghl8006.blog.163.com/blog/static/4528311520083995931317/ over(Partition by...) 一个超级牛皮的ORAC ...
- python之面向对象的程序设计
一.什么是面向对象的程序设计 面向过程的程序设计的核心是过程,过程即解决问题的步骤,面向过程的设计就好比精心设计好一条流水线,考虑周全什么时候处理什么东西. 优点是:极大的降低了程序的复杂度 缺点是: ...
- JS_高程3.基本概念(5)语句
1.if语句 2.do-while语句:后测循环语句,循环体内的代码至少执行一次. 3.while语句:前测循环语句. 4.for语句:前测循环语句. 注意:在ECMAScript中不存在块级作用域, ...
- JS膏集05
JS膏集05 1.复习 闭包内的函数也可以使用参数 闭包的建议写法 ) 2.浅拷贝 相当于把一个对象中的所有的内容复制一份给另一个对象.直接复制. 或者说,就是把一个对象的地址给了另一个对象,它们指向 ...
- 8、jsのBOM对象与DOM对象
javascript的Bom和Dom对象使我们学习的重点,这篇随笔可以重点阅读 本篇导航: BOM对象 DOM对象 DOM Event(事件) 实例练习 一.BOM对象 1.window对象 所有浏览 ...