小程序现在支持直接通过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安装包的更多相关文章

  1. 微信小程序使用npm安装第三方库

    微信小程序在 2.2.1 版本后增加了对 npm 包加载的支持,使得小程序支持使用 npm 安装第三方包. 之前在微信开发者工具选择“构建npm”会报错“没找到node_modules”目录”,这是因 ...

  2. 微信小程序 - 使用npm(第三方包)

    使用示例: 1. 开启“使用npm模块” 2. 新建 node_modules 文件夹 3. cd到新建 node_modules 所在的目录(非node_modules文件夹内) npm insta ...

  3. 微信小程序开发教程 #043 - 在小程序开发中使用 npm

    本文介绍了如何在微信小程序开发中使用 npm 中包的功能,大大提高微信小程序的开发效率,同时也是微信小程序系列教程的视频版更新. 微信小程序在发布之初没有对 npm 的支持功能,这也是目前很多前端开发 ...

  4. 原生微信小程序脚手架(支持npm)

    微信小程序支持npm 为了支持生态扩展,社区贡献者可以提供更加丰富的功能,已经支持了第三方小程序开发功能,见如下地址. 微信小程序支持npm https://developers.weixin.qq. ...

  5. 使用gulp构建微信小程序工作流

    前言 刚入门微信小程序的时候,一切都基于微信web开发者工具,没有使用其他框架,也没有工程化的概念.当时做的项目都比较简单,单单用微信web开发者工具倒也得心应手.学了些东西后,就按捺不住地想跳出原生 ...

  6. 微信小程序导入Vant报错

    作者:如也_d1c0链接:https://www.jianshu.com/p/0d2332984f8c来源:简书简书著作权归作者所有,任何形式的转载都请联系作者获得授权并注明出处. 先放出来Vant ...

  7. 微信小程序没找到构建npm或者没找到node_modules目录以及如何在小程序中引入vant weapp组件

    微信小程序没找到构建npm或者没找到node_modules目录解决方法如下: 按照微信小程序提供的文档npm install是不行的,直接提示没找到可构建的npm包. 1.直接安装:npm init ...

  8. 微信小程序没有找到可以构建的npm包

    如果是云开发小程序 ,cmd窗口进入到小程序根目录下的miniprogram目录, 输入npm init 输入包的相关属性,随便输入即可. 完成后会出现一个package.json文件. 如果是其他类 ...

  9. 微信小程序中使用 npm包管理 (保姆式教程)

    打开自己的微信小程序项目,在勾选这个选项 然后在第一次应该是失败的提示"没有找到可以构建的npm包". 在 小程序的根目录下比如我的项目如图: 右击鼠标在终端中打开. 然后输入:n ...

随机推荐

  1. 权限框架Apache Shiro 和 Spring Security

    Shiro 首先Shiro较之 Spring Security,Shiro在保持强大功能的同时,还在简单性和灵活性方面拥有巨大优势.Shiro是一个强大而灵活的开源安全框架,能够非常清晰的处理认证.授 ...

  2. Nodejs连接mysql的增、删、改、查操作

    一,创建数据库 Source Database : my_news_test SET FOREIGN_KEY_CHECKS=0; -- ---------------------------- -- ...

  3. django rest_framework 序列化组件详解

    为什么要用序列化组件 当我们做前后端分离的项目,我们前后端交互一般都选择JSON数据格式,JSON是一个轻量级的数据交互格式. 那么我们给前端数据的时候都要转成json格式,那就需要对我们从数据库拿到 ...

  4. Python贪婪算法

    贪婪算法 每步均选择局部的最优解,重复此过程,最终即得到全局的最优解 简而言之就是每步都采用最优解 优点: 简单易行 缺点: 并非在所有情况下都奏效 经典的问题: 背包问题 集合覆盖问题 贪婪算法下的 ...

  5. PHP的json_encode不兼容JSON_UNESCAPED_UNICODE的解决方案

    PHP5.4才支持JSON_UNESCAPED_UNICODE这个参数,此参数是让中文字符在json_encode的时候不用转义,减少数据传输量.但在PHP5.3中,就得自己写个函数来实现,以下就是解 ...

  6. 2-SAT问题的小结

    简介 什么是2-SAT呢?就是有一些集合,每个集合中有且仅有两个元素,且不能同时选取两个元素,集合间的元素存在一定的选择关系,求解可行性及可行方案. 算法 1.连边 2.跑tarjan 3.判可行性, ...

  7. ES6 对对象的扩展

    1.对象类别 普通对象:具有JavaScript对象的所有默认内部行为 特异对象: 具有某些与默认行为不符的内部行为 标准对象: ECMAScript 6 规范中新定义的对象,例如Array,Date ...

  8. 1. Spring 简介以及关于 Eclipse 的 Spring Tool Suite 插件安装

    今天开始学 Spring 了,就先来认识一下什么是 Spring 吧. 1. 首先,Spring 是一个框架,而且是开源的. 2. Spring 为简化企业级应用开发而生.使用 Spring 可以使简 ...

  9. centos 7 之nginx

    环境信息 [root@node1 ~]# cat /etc/redhat-release CentOS Linux release (Core) [root@node1 ~]# uname -r -. ...

  10. Egret 项目文件夹配置和基本容器、动画

    Egret 项目文件夹配置和基本容器.动画: class Main extends egret.DisplayObjectContainer { //src是resource codede 缩写,所有 ...