微信小程序引用npm包

微信小程序官方支持使用npm包,地址为 https://developers.weixin.qq.com/miniprogram/dev/devtools/npm.html

实际上我们创建的小程序模板中没有 package.json , 导致开发者工具中的 构建npm 执行操作不成功

需要先配置好node和npm环境,在cmd命令窗口中可以使用这两个命令。

然后增加如下步骤:

  1. 在创建小程序项目自动生成的miniprogram中反键----> 在终端中打开;
  2. 在打开的cmd窗口中输入命令 npm init, 一直按Enter, 会自动构建package.json文件;
  3. 构建完package.json文件后,我们就可以添加对应的npm包了
  4. 输入命令 npm install -S --production [对应npm包], 会在当前目录生成node_modules目录,里面包含对应npm包
  5. 点击开发者工具栏的 工具 -> 构建npm ,会有 完成构建... 等提示,此时会生成 miniprogram_npm 目录
  6. 在对应的js文件中使用 require("npm包") 就可以使用啦

小程序开发-使用npm包的更多相关文章

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

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

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

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

  3. 在小程序开发中使用 npm

    微信小程序在发布之初没有对 npm 的支持功能,这也是目前很多前端开发人员在熟悉了 npm 生态环境后,对微信小程序诟病的地方. 微信小程序在 2.2.1 版本后增加了对 npm 包加载的支持,使得小 ...

  4. 详解微信小程序开发(项目从零开始)

    一.序 微信小程序,估计大家都不陌生,现在应用场景特别多.今天就系统的介绍一下小程序开发.注意,这里只从项目代码上做解析,不涉及小程序如何申请.打包.发布的东西.(这些跟着微信官方文档的流程走就好). ...

  5. 第一个mpvue小程序开发总结

    前言 说起小程序,其实在去年我都还只试着照着官方文档写过demo的,不过现在这家公司小程序做得比较多,我来之后也参与了几个小程序的开发了,最开始那几个是用的wepy,最近一个开始转用mpvue开发,最 ...

  6. 微信小程序开发:学习笔记[5]——JavaScript脚本

    微信小程序开发:学习笔记[5]——JavaScript脚本 快速开始 介绍 小程序的主要开发语言是 JavaScript ,开发者使用 JavaScript 来开发业务逻辑以及调用小程序的 API 来 ...

  7. 记一次基于 mpvue 的小程序开发及上线实战

    小程序名称:一起打车吧 项目地址: 客户端:https://github.com/jrainlau/taxi-together-client 服务端:https://github.com/jrainl ...

  8. 微信小程序开发(二)----- 云开发

    1.概念 微信小程序的云开发是腾讯云与微信团队深度合作推出的一个全新的小程序的解决方案,它提供了云函数.云数据库与云存储这三大基础能力支持,随着云开发的出现,小程序的开发者可以将服务端的部署和运营的环 ...

  9. 【好好编程-技术博客】微信小程序开发中前后端的交互

    微信小程序开发中前后端的交互 微信小程序的开发有点类似与普通网页的开发,但是也不尽然相同.小程序的主要开发语言是JavaScript,开发同普通的网页开发有很大的相似性,对于前端开发者而言,从网页开发 ...

随机推荐

  1. 关于css布局中,inline-block元素间隙的处理方法

    关于inline-block元素间隙的处理 参考橱窗外的小孩,原文链接https://www.cnblogs.com/showcase/p/10469361.html 如下,两个inline-bloc ...

  2. 【模式识别与机器学习】——PART2 机器学习——统计学习基础——Regularized Linear Regression

    来源:https://www.cnblogs.com/jianxinzhou/p/4083921.html 1. The Problem of Overfitting (1) 还是来看预测房价的这个例 ...

  3. Homekit_Dohome_智能插座

    简介: 本款智能插座有三个版本可供选择,分别为Homekit版本,涂鸦版本,Dohome版本,各个版本的区别如下: DoHome版特点: 支持HomeKit 支持Amazon 支持Google ...

  4. jQuery的事件与 动画

    什么是事件: 事件的本质是委托. Jquery的 方法: $().css(); $().click(); 等等. 鼠标的事件: 区别在于:mouseover与mouseout再进入或离开后会执行这两个 ...

  5. GRE 协议 - 和 ISP 用的协议不一样怎么办

    GRE 出现的背景: 随着网络(公司)规模的增大,越来越多的公司需要在跨区域之间建设自己的分公司.但随之也就出现了这样的问题,考虑这样一个场景.公司 A 在北京和上海间开设了两家公司,由于业务的需要, ...

  6. Oracle用户授权

    一.用户授权 1)普通权限 grant ${autoType1, autoType2, autoType3, ...} to ${userName} identified by ${password} ...

  7. gtk.Builder.AddFromFile SIGSEGV.

    可能是由于GTK没有初始化的缘故,在程序开头加上gtk.Init(nil)进行初始化 或者参考我这篇博客就不会出错了

  8. C# 监听值的变化

    1.写一个监听值变化的类 public class MonitorValueChange { private Visibility myValue; public Visibility MyValue ...

  9. JavaScript学习系列博客_15_栈内存、堆内存

    栈内存 - JS中的变量都是保存到栈内存中的,- 基本数据类型的值直接在栈内存中存储,- 值与值之间是独立存在,修改一个变量不会影响其他的变量 堆内存 - 对象是保存到堆内存中的,每创建一个新的对象, ...

  10. Latex — 写作编译过程中遇到问题记录与总结

    最近在训练的时候,又开始用Latex进行写作.碰到了很多问题,将问题进行记录与总结. 一.输出中文的问题 由于写作的时候用的是中文,而之前用的是英文,故碰到的第一个问题就是中文的问题.我之前下的是Wi ...